angular8+ng-zorro i18n方案
1.采用的技术方案
ng-zorro的国际化NzI18nService服务 + ngx-translate插件。
ng-zorro NzI18nService服务主要用来配置ng-zorro组件的国际化；
ngx-translate插件主要用来翻译页面的文字显示。
2.实现的具体方案
1) 安装所需的依赖
npm install @ngx-translate/core --save
npm install @ngx-translate/http-loader --save
2) 引入TranslateModule模块
在AppModule中引入TranslateModule模块
import {TranslateModule} from '@ngx-translate/core';
根路由引入TranslateModule模块相关配置并在imports中配置如下：
import {TranslateLoader, TranslateModule} from '@ngx-translate/core';
import {TranslateHttpLoader} from '@ngx-translate/http-loader';
import {HttpClient} from '@angular/common/http';
配置AppModule的 imports如下：
TranslateModule.forRoot({
loader: {
provide: TranslateLoader,
useFactory: HttpLoaderFactory,
deps: [HttpClient]
}
}),
最后在模块之外导出 HttpLoaderFactory
export function HttpLoaderFactory(http: HttpClient) {
return new TranslateHttpLoader(http);
}
3) 引入语言json文件
语言json文件是用来对页面文字进行翻译的根据，需要自己编写。en.json是翻译
成英文的文件，zh.json是翻译成中文的文件。
推荐在assets中引入语言文件。
4) 设置语言；
通常在AppComponent中设置默认的语言
1）ng-zorro组件的默认语言设置，使用registerLocaleData()设置，切换语言使用this.i18n.setLocale()方法，
2）ngx-translate设置默认语言，使用translate.setDefaultLang()设置，切换语言时使用this.translate.setDefaultLang(),
设置语言后，全局可通用。
5）页面翻译：
只需要在翻译的模块中引入TranslateModule模块，component中引入TranslateService即可
- html中翻译
加入管道符 translate即可（包括页面的静态字符串和变量均可），
如：<button nz-button class="login-form-button" [nzType]="'primary'">{{'登录'| translate}}</button>
-ts中翻译
使用this.translate.get(需要翻译的变量)，即可得到翻译后的结果，
如：
this.translate.get(data.reason).subscribe(val => {
this.msg = val;
this.message.create('error', this.msg );
})
