デフォルトの実装よりも優れていると思われるため、アプリケーションの国際化に ng2-translate ライブラリを使用することにしました。しかし、私は次の問題に直面しました。
これが私のコードです：
app.module.ts:
import { TranslateModule } from 'ng2-translate';
@NgModule({
imports: [
BrowserModule,
HttpModule,
TranslateModule.forRoot(),
appRoutes
],
app.component.ts
@Component({
selector: 'fiv-app',
templateUrl: './app.fivtemplate.html',
providers: [TranslateService]
})
.....
constructor(private _translateService: TranslateService) {
this.langs= ['fi','en'];
_translateService.addLangs(["en", "fi"]);
_translateService.setDefaultLang('fi');
let browserLang = _translateService.getBrowserLang();
_translateService.use('fi');
}
.....
app.component.html
<fiv-hello></fiv-hello>
<h2>{{ 'HOME.TITLE' | translate }}</h2>
および fivhello.component.ts
<h2>{{ 'HOME.TITLE' | translate }}</h2>
<div [translate]="'HOME.TITLE'"> Test</div>
- 最新バージョンの 5.0.0 を使用しようとしましたが、次のエラーが発生します。
キャッチされていない TypeError: ctorParameters.map は ReflectionCapabilities.parameters の関数ではありません ( http://localhost:4200/main.bundle.js:40295:47 )
angular-cli 、 angular 2.0.0 、および npm を使用しているため、構成で正常に動作しているように見える 4.2.0 に切り替えました。
app.component.html のテキストが翻訳されます。ただし、 fivhello コンポーネントのものはローカライズされていません。HOME.TITLEを表示するだけです。デバッグ中に TranslateService からの get 関数がレンダリング後に呼び出されることに気付きましたが、テキストが更新されることを期待していました。
使用する言語を変更した後、dom も更新されません。言語を変更するために使用されるコンポーネントは次のとおりです。
@Component({ selector: 'language-option', templateUrl: './languageoption.component.html', styleUrls: ['./languageoption.component.css'], providers: [ TranslateService ] }) export class LanguageoptionComponent implements OnInit { langs : String []; constructor(private _translateService: TranslateService) { this.langs = ['fi', 'en']; } ngOnInit() { } public changeLocale = (locale) => { this._translateService.use(locale); } }誰かが同じ問題に遭遇しましたか？
ありがとう。