Ngx-translate with Angular Universal
Ngx-translate with Angular Universal
我刚刚在 Angular 2 Universal App 中从 ng2-translate
(v. 5.x.x
) 升级到 ngx-translate
(v. 6.x.x
)。
在升级之前我使用的是这个加载程序 (found here):
class TranslateUniversalLoader implements TranslateLoader {
public getTranslation(lang: string): Observable<any> {
return Observable.create(observer => {
observer.next(JSON.parse(fs.readFileSync(`src/i18n/${lang}.json`, 'utf8')));
observer.complete();
});
}
}
我是这样使用的:
@NgModule({
bootstrap: [AppComponent],
declarations: [ AppComponent ],
imports: [
FormsModule,
CoreModule,
ViewsModule,
TranslateModule.forRoot({
provide: TranslateLoader,
useClass: TranslateUniversalLoader,
}),
UniversalModule
]
})
升级到 ngx-translate
后,我在终端控制台中收到此错误(因此,服务器端错误):
Module build failed: Error: /src/app/app.node.module.ts (65,7):
Argument of type '{ provide: typeof TranslateLoader; useClass: typeof TranslateUniversalLoader; }' is not assignable to parameter of type 'TranslateModuleConfig'.
所以有人知道如何使用 Angular 通用 ngx-translate
为服务器端支持设置自定义加载程序吗?
解决方案比预期的要容易得多,并且在 migration guide 中有详细说明。
在 6.x.x
中,破坏代码的更改是传递给 forRoot()
的预期值。
现在我们需要将加载程序作为 loader
键的对象传递,如下所示:
TranslateModule.forRoot({
loader: {
provide: TranslateLoader,
useClass: TranslateUniversalLoader,
}
}),
我刚刚在 Angular 2 Universal App 中从 ng2-translate
(v. 5.x.x
) 升级到 ngx-translate
(v. 6.x.x
)。
在升级之前我使用的是这个加载程序 (found here):
class TranslateUniversalLoader implements TranslateLoader {
public getTranslation(lang: string): Observable<any> {
return Observable.create(observer => {
observer.next(JSON.parse(fs.readFileSync(`src/i18n/${lang}.json`, 'utf8')));
observer.complete();
});
}
}
我是这样使用的:
@NgModule({
bootstrap: [AppComponent],
declarations: [ AppComponent ],
imports: [
FormsModule,
CoreModule,
ViewsModule,
TranslateModule.forRoot({
provide: TranslateLoader,
useClass: TranslateUniversalLoader,
}),
UniversalModule
]
})
升级到 ngx-translate
后,我在终端控制台中收到此错误(因此,服务器端错误):
Module build failed: Error: /src/app/app.node.module.ts (65,7):
Argument of type '{ provide: typeof TranslateLoader; useClass: typeof TranslateUniversalLoader; }' is not assignable to parameter of type 'TranslateModuleConfig'.
所以有人知道如何使用 Angular 通用 ngx-translate
为服务器端支持设置自定义加载程序吗?
解决方案比预期的要容易得多,并且在 migration guide 中有详细说明。
在 6.x.x
中,破坏代码的更改是传递给 forRoot()
的预期值。
现在我们需要将加载程序作为 loader
键的对象传递,如下所示:
TranslateModule.forRoot({
loader: {
provide: TranslateLoader,
useClass: TranslateUniversalLoader,
}
}),