我的项目是使用Angular CLI设置的,因此它是使用webpack构建的,但webpack配置文件是隐藏的。
我有两个文件,nl.json
和fr.json
,但对于这两个文件都会得到404
错误,尽管它看起来正在访问正确的文件夹:http://localhost:4200/i18n/nl.json
。
它们具有以下结构:
{
"SEARCH_PAGE": {
"searchPerson": "Zoek een persoon",
"search": "Zoek"
}
}
在 app.module 中:
...
TranslateModule.forRoot({
loader: {
provide: TranslateLoader,
useFactory: HttpLoaderFactory,
deps: [Http]
}
}),
...
和
export function HttpLoaderFactory(http: Http) {
return new TranslateHttpLoader(http, "/i18n/", ".json");
}
我也将它们包含在我的子模块中,当我尝试使用翻译时,使用.forChild
而不是.forRoot
的区别。
在我的组件中:
constructor(translate: TranslateService) {
translate.addLangs(["nl", "fr"]);
translate.setDefaultLang('nl'); // this language will be used as a fallback when a translation isn't found in the current language
let browserLang: string = translate.getBrowserLang();
translate.use(browserLang.match(/nl|fr/) ? browserLang : 'nl');
}
这可能与ngx-translate
无关吗?
当我使用管道<h1>{{ 'SEARCH_PAGE.searchPerson' | translate}}</h1>
时,屏幕上什么也没有显示,当我使用指令<h1 translate]="'SEARCH_PAGE.searchPerson'"></h1>
时,我得到的是字面字符串。
web.config
文件才能解决这个问题。 - ramzan ali