Angular7使用ngx-translate多语言配置采坑记录

步骤：
下载安装包：

npm install @ngx-translate/core@10.x --save
npm install @ngx-translate/http-loader@4.x --save

在项目中src/assets/下创建i18n文件；
以下例子是中英文的json文件

json文件里写入数据

对应的中文：

大概就是这个样子哈，
在跟模块app.module.ts导入模块

import {
    
     TranslateHttpLoader } from '@ngx-translate/http-loader';

import {
    
     TranslateModule, TranslateLoader, TranslateService } from '@ngx-translate/core';


中间省略


export function createTranslateHttpLoader(http: HttpClient) {
    
    
  return new TranslateHttpLoader(http, './assets/i18n/', '.json');
}


@NgModule({
    
    
  imports: [
     ===省略===
      TranslateModule.forRoot({
    
    
      loader: {
    
    
        provide: TranslateLoader,
        useFactory: createTranslateHttpLoader,
        deps: [HttpClient]
      }
    }),
    ===省略===
]
})

在使用的组件的module.ts里引入

import {
    
     TranslateModule } from '@ngx-translate/core';


imports 里引入TranslateModule 

在html中翻译文字：

 <span class="title-text">{
    
    {
    
     'userGroup.userList' | translate }}</span>
//对应语言的json文件内分别都要有对应的文字

在ts文件中翻译文字：

//例子，当前页面的tab渲染：
在当前组件引入CommonService

在构造器中引入 private common: CommonService,

 this.tabsUserArray = [
      { text: this.common.lang('userGroup.addedUser'), id: '0' },
      { text:  this.common.lang('common.all'), id: '1' },
    ];

在ts文件中dialogs弹窗

当前场景下是删除：
     this.dialogs.confirm(this.common.lang('common.dialogDelApp')).subscribe(
     //略

删除按钮修改：
在core/dialogs.service.ts中：

在不同的语言下正则校验还会不一样，所以把正则表达式也维护在json文件中

需要注意的点：

在json文件里 \d 会报错，所以需要写\\d