關於angular2.0的i18n國際化的解決方法，分享一下給你們，有錯你們指出來互相學習哈。。。

關於angular2的i18n，網上的資料也很少，恰好項目須要用到，就本身去查閱各類資料，本身整理了出來，分享下出來給你們吧。廢話很少說！直接上代碼：

首先咱們確定要新建一個文件，叫aaa（網上angular-cli教程不少），
cmd打開命令進入到隨便一個目錄底下：

ng new aaa                    --建立名字叫aaa文件

輸入指令下載依賴

npm install           --下載依賴包node_modules

這時文件所有都有了：

緊接着開始咱們關於i18n解決方法。
在aaa這個文件目錄底下輸入命令來安裝ng2-translate：

npm install  ng2-translate            --save
npm install  @ngx-translate/core         
npm install  @ngx-translate/http-loader

而後打開咱們的文件在一個文件名爲assets底下新建一個文件夾名字叫i18n，assets在文件src裏面，而後文件夾裏面再建立兩個json文件，名字分別爲「en.json」和「zh-CN.json」，分別表明英文和中文（記得編輯器生成後改編碼utf-8，否則以後瀏覽器顯示中文會亂碼）。

en.json：

{
"hello":"Hollo",
"language":"Chinese and English"
}

zh-CN.json:

{
"hello":"你好",
"language":"中文和英文"
}

而後在打開app文件，在 app.module.ts 中添加如下代碼：

import { TranslateHttpLoader } from '@ngx-translate/http-loader';
import {Http} from '@angular/http';
import { TranslateModule, TranslateStaticLoader, TranslateLoader } from 'ng2-translate/ng2-translate';


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

@NgModule({
  imports: [
    BrowserModule,
    TranslateModule.forRoot({
      provide: TranslateLoader,
      useFactory: (HttpLoaderFactory),
      deps: [Http]
    })
  ],
  providers: [],
  bootstrap: [AppComponent]
})

而後在app.component.ts文件裏面：添加一下代碼：

import {TranslateService} from 'ng2-translate';

export class AppComponent {
    getLangs:any[];  //定義一個數組
    constructor(private translate: TranslateService) {
    //添加語言支持
    }
    ngOnInit(){
        //下拉按鈕的值
        this.getLangs = [
            {label:'中文',value:'zh-CN'},
            {label:'英語',value:'en'}
        ];
        //添加語言
        this.translate.addLangs(['zh-CN', 'en']);

        //設置默認語言
        this.translate.setDefaultLang('zh-CN');

        //獲取當前瀏覽器環境的語言好比en、zh-CN
        let broswerLang = this.translate.getBrowserLang();
        
        //使用語言
        this.translate.use(broswerLang.match(/en|zh-CN/) ? broswerLang : 'zh-CN');    
    }

    changeLang(index) {
         this.translate.use(index);
    }
    
      title = 'angular-Translate';
}

最後html代碼呈上：

<div style="text-align:center">
    <h1>
        Welcome to {{title}}!
    </h1>
  </div>
  <div class="language">{{ 'language' | translate }}</div>
  <div>
    <select #langSelect (change)="changeLang($event.target.value)" class="selectBtn">
          <option *ngFor="let lang of getLangs" [value]="lang.value">{{lang.label}}</option>
    </select>
</div>

最後一步：
輸入指令

ng serve     //啓動服務