关于ng2+ 中 NG-ZORRO 的国际化配置问题?

yyccQQu
  • 340

1、显示配置文档

clipboard.png

2、i18n.service.ts的代码

import { Injectable, Inject, Injector } from '@angular/core';
import { Router } from '@angular/router';
import { zhCN, enUS, NzLocaleService } from 'ng-zorro-antd';
import { TranslateService } from '@ngx-translate/core';
import { SettingsService, AlainI18NService } from '@delon/theme';
import { Observable } from 'rxjs/Observable';

@Injectable()
export class I18NService implements AlainI18NService {

private _default = 'zh-CN';

private _langs = [
    { code: 'en', text: 'English' },
    { code: 'zh-CN', text: '中文' }
];

constructor(
    settings: SettingsService,
    private nzLocalService: NzLocaleService,
    private translate: TranslateService,
    private injector: Injector
) {
    const defaultLan = settings.layout.lang || translate.getBrowserLang();
    const lans = this._langs.map(item => item.code);
    this._default = lans.includes(defaultLan) ? defaultLan : lans[0];
    translate.addLangs(lans);
}

use(lang: string = null, firstLoad = true): Observable<any> {
    lang = lang || this.translate.getDefaultLang();
    this.nzLocalService.setLocale(lang === 'en' ? enUS : zhCN);
    // need reload router because of ng-zorro-antd local system
    if (!firstLoad) this.injector.get(Router).navigate([ '/' ]);
    return this.translate.use(lang);
}
/** 获取语言列表 */
getLangs() {
    return this._langs;
}
/** 翻译 */
fanyi(key: string) {
    return this.translate.instant(key);
}
/** 默认语言 */
get defaultLang() {
    return this._default;
}
/** 当前语言 */
get currentLang() {
    return this.translate.currentLang || this.translate.getDefaultLang() || this._default;
}

}

3、遇到的问题

每次初始化的时候导航栏会有英文,而我想要的是中文。点击其他路由时会恢复正常、、、、
clipboard.png

clipboard.png

回复
阅读 4.4k
2 个回答

在进入页面的时候,确保所有数据加载完成,可以调试一下,感觉你是点击路由后,这些国际化数据才会加载,之前用alian也碰到类似问题,它只有一个start.ts, 但是有些异步数据的获取结束前,就跳到页面,导致页面数据有问题,我记得是权限吧,刷新是有问题的

宣传栏