angular Universal starter app で ngx-translate を使用するために、半日以来成功していませんhttps://github.com/angular/universal-starter
。フォローがうまくいかない理由を知っている人はいますか?
サーバーを起動npm start
してページをリロードすると、key
伝統的にngx-translateで何かが機能しないことを示す に置き換えられる前に、翻訳が見つかったことが簡単にわかります。また、翻訳のパスを変更するserver-app.module.ts
と、サーバーのコンソールにエラーが表示されるため、サーバー部分は問題なく、問題はクライアント側にあると思います。
app.module.ts:
export function exportTranslateStaticLoader(http: HttpClient) {
return new TranslateHttpLoader(http, './assets/i18n/', '.json');
}
imports: [
TranslateModule.forRoot({
loader: {
provide: TranslateLoader,
useFactory: exportTranslateStaticLoader,
deps: [Http]
}
}
)
]
browser-app.module.ts:
imports: [TranslateModule.forChild()]
サーバー-app.module.ts:
export function translateFactory() {
return new TranslateUniversalLoader('./dist/assets/i18n', '.json');
}
imports: [
TranslateModule.forRoot({
loader: {
provide: TranslateLoader,
useFactory: translateFactory
}
})
]
TranslateUniversalLoader:
import {Observable} from "rxjs/Observable";
import {TranslateLoader} from '@ngx-translate/core';
const fs = require('fs');
export class TranslateUniversalLoader implements TranslateLoader {
constructor(private prefix: string = 'i18n', private suffix: string = '.json') {}
public getTranslation(lang: string): Observable<any> {
return Observable.create(observer => {
observer.next(JSON.parse(fs.readFileSync(`${this.prefix}/${lang}${this.suffix}`, 'utf8')));
observer.complete();
});
}
}
webpack.common.js:
plugins: [
new copyWebpackPlugin([
{
from: './src/assets/i18n/en.json',
to: './assets/i18n/en.json'
}
])
]
app.component.ts:
ngOnInit() {
this.translateService.setDefaultLang('en');
this.translateService.use('en');
}
さらに、クエリhttp://localhost:8000/assets/i18n/en.json
を実行すると、有効な回答がそれぞれ en.json に返されます。
{
"TEST": "Super super"
}
助けていただければ幸いです。これは私を夢中にさせます。