我正在尝试动态更改语言环境以更改 i18n 语言。
我有两个文件,一个包含英语值,另一个包含法语值。
我现在尝试过的是这样的:
ngOnInit() {
const localeName = localStorage.getItem('locale') || 'fr';
import(`@angular/common/locales/${localeName}.js`).then(locale => {
registerLocaleData(locale.default);
});
}
但它给了我以下错误:
error TS1323: Dynamic import cannot be used when targeting ECMAScript 2015 modules.
关于如何动态从英语切换到法语有什么想法吗? :/
好吧,不确定这是一个好的解决方案,但这就是我所做的。它适合我的目的,所以也许它可以帮助其他人。
在 main.ts 中:
if (localStorage.getItem('locale') === null) {
localStorage.setItem('locale', 'en');
}
const locale = localStorage.getItem('locale');
declare const require;
const translations = require(`raw-loader!./locale/messages.${locale}.xlf`);
platformBrowserDynamic().bootstrapModule(AppModule, {
providers: [
{provide: TRANSLATIONS, useValue: translations},
{provide: TRANSLATIONS_FORMAT, useValue: 'xlf'}
]
});
在html代码中:
<a mat-menu-item href="" (click)="changeLang('fr')">
<mat-icon>settings</mat-icon>
<span>FR</span>
</a>
<a mat-menu-item href="" (click)="changeLang('en')">
<mat-icon>settings</mat-icon>
<span>EN</span>
</a>
在组件.ts中:
changeLang(lang: string) {
if (lang === 'fr') {
localStorage.setItem('locale', 'fr');
}
if (lang === 'en') {
localStorage.setItem('locale', 'en');
}
}
别骂我,我只是个有棱角的新手^^
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)