[解決済み] Angular 2.0 翻訳パイプが見つかりません。
2022-02-10 22:32:44
質問
translateServiceを使用したコンポーネントがあるのですが、Component Template HTMLのパイプでアイテムを翻訳することができず、以下のエラーが発生します。
パイプ 'translate' が見つかりませんでした。
app.module.ts
import {BrowserModule} from "@angular/platform-browser";
import {NgModule} from "@angular/core";
import {HttpModule, Http} from "@angular/http";
import {TranslateModule, TranslateLoader, TranslateStaticLoader} from 'ng2-translate';
import {AppComponent} from "./app.component";
@NgModule({
declarations: [AppComponent],
imports: [
BrowserModule,
HttpModule,
TranslateModule.forRoot({
provide: TranslateLoader,
useFactory: (http: Http) => new TranslateStaticLoader(http, './assets/i18n', '.json'),
deps: [Http]
})
],
bootstrap: [AppComponent]
})
export class AppModule {
}
booking.component.ts
import {Component, OnInit} from '@angular/core';
import {BookingComponent} from './booking.component';
import {TranslateService} from 'ng2-translate';
@Component({
selector: 'app-booking',
templateUrl: './booking.component.html',
styleUrls: ['./booking.component.css']
})
export class BookingComponent implements OnInit {
constructor(private translate: TranslateService
) {
translate.setDefaultLang('de');
translate.use('de');
};
ngOnInit() {
}
}
booking.component.html
<p>{{'TESTKEY' | translate }}</p>
コンポーネント上のサービスによる翻訳はうまくいきますが、パイプを使ったhtmlも翻訳する必要があります。
どのように解決するのですか?
必要なのは
imports: [ TranslateModule ]
をどのようなモジュールであっても
BookingComponent
で宣言されています。appモジュールでのimportは、そのモジュールで宣言されたコンポーネントに対してのみパイプを利用できるようにします。しかし、プロバイダやサービスはモジュールからグローバルに登録されます(コンポーネント、ディレクティブ、パイプとは異なります)。
関連
-
[解決済み】Angular: オブジェクトをサポートしているdiffが見つからない '[object Object]'
-
[解決済み] 型 '{}' は型 '{ title: string; text: string; }' に代入できません。
-
[解決済み] Angular 2のコンポーネントプロパティにデフォルト値を設定する方法は?
-
[解決済み] NullInjectorError: MatDialogRef 用のプロバイダがありません
-
[解決済み] NgModule が見つかりませんでした。NgModule でのインポートをスキップするには skip-import オプションを使用します。
-
[解決済み] updateValueAndValidityとは?
-
[解決済み] ionInputとionChangeで有意差あり
-
[解決済み] 安全でない値」の例外を発生させずに <iframe src="..."> を設定するにはどうしたらよいですか?
-
[解決済み] Error.を修正する方法 No value accessor for form control with name' in Angular Unit Test?
-
[解決済み] モジュール "@angular-devkit/build-angular" が見つかりませんでした。
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み】VSCodeはモジュール'@angular/core'や他のモジュールを見つけることができません。
-
[解決済み] node_modules が空になったので、`npm install`を実行する必要があるかもしれない。
-
[解決済み】ngサーブが機能しない
-
[解決済み] テンプレートパースエラーです。'mat-icon' は既知の要素ではありません。
-
[解決済み] Angular material Angular Material コアテーマが見つかりませんでした。
-
[解決済み] Angular "未定義のプロパティ 'subscribe' を読み取ることができません".
-
[解決済み] Angular 2.0 翻訳パイプが見つかりません。
-
[解決済み] このメソッドをリファクタリングして、認知的複雑度を21から許容される15に下げます。リファクタリングして複雑さを軽減する方法
-
[解決済み] Angular 2の「コンポーネント」は既知の要素ではありません。
-
[解決済み] ローカルホストが私のアンギュラーアプリに対して無効な応答を送信しました。