我想在我的前端使用ngx-translate在app load上动态加载翻译。
我的后端以JSON格式返回响应,例如:
{
"something: "something"
}
我想在我的TranslateLoader而不是本地en.json
文件上使用该输出。
有没有办法实现这一目标?
TL; DL:我想调用'http://localhost:xxxx/api/translation/EN'获取翻译的JSON响应并将其加载到TranslateHttpLoader
你可以创建一个工厂:
export function httpLoaderFactory(http: HttpClient) {
return new TranslateHttpLoader(http, "http://localhost:xxxx/api/translation/", "");
}
并在@NgModule导入中使用它:
TranslateModule.forRoot({
loader: {
provide: TranslateLoader,
useFactory: httpLoaderFactory,
deps: [HttpClient]
}
}),
我们可以使用Custom Loader Class实现TranslateLoader提供程序
In Module :
export class CustomLoader implements TranslateLoader {
constructor(private http: Http) {}
public getTranslation(lang: String): Observable<any> {
return this.http.get(URL).map(
(res: any) => {
return res;
}
);
}
}
@NgModule({
imports: [
TranslateModule.forRoot({
provide: TranslateLoader,
useClass: CustomLoader,
// useFactory: (createTranslateLoader),
deps: [Http]
})
]
})
在组件中:
constructor(private _translate: TranslateService){}
const transText = this._translate.instant('something');