我正在关注有关Angular翻译的本教程(https://alligator.io/angular/ngx-translate/)。当我在HTML文件中调用翻译时,什么都没有发生,而且我看到一个空行:
<label translate='demo.title'></label>
但是在我的component.ts中,如果导入导入{TranslateService} from '@ngx-translate/core';
,我可以使用以下方式获得正确的翻译:
title:string;
constructor(private translate: TranslateService) { }
ngOnInit() {
this.translate.get(['demo.title'])
.subscribe(translations => {
this.title = translations['demo.title'];
console.log(this.title ); // the right translations appears in console
});
}
app.module.ts
// import ngx-translate and the http loader
import {TranslateLoader,TranslateModule} from '@ngx-translate/core';
import {TranslateHttpLoader} from '@ngx-translate/http-loader';
@NgModule({
declarations: [AppComponent],imports: [
BrowserModule,AppRoutingModule,HomeModule,IndexModule,NoPageModule,HttpClientModule,// ngx-translate and the loader module
TranslateModule.forRoot({
loader: {
provide: TranslateLoader,useFactory: HttpLoaderFactory,deps: [HttpClient]
}
}),RouterModule.forRoot(routes,{ useHash: true }),],providers: [AuthService,AuthGuard],bootstrap: [AppComponent],schemas:[CUSTOM_ELEMENTS_SCHEMA]
})
export class AppModule {}
// required for AOT compilation
export function HttpLoaderFactory(http: HttpClient) {
return new TranslateHttpLoader(http);
}
pt.json
{
"demo": {
"title": "oi","text": "This is a simple demonstration app for ngx-translate"
}
}
与该主题有关,我如何通过Angular知道浏览器语言?
最诚挚的问候