1. 程式人生 > >利用ngx-angular實現angular2的國際化

利用ngx-angular實現angular2的國際化

使用angular-cli初始化專案:
ng new my-project
使用npm安裝ngx-translate模組
npm install --save @ngx-translate/core
npm install --save @ngx-translate/http-loader
在專案的根模組app.module.ts中引入該模組

import { TranslateModule, TranslateLoader } from '@ngx-translate/core';
import { TranslateHttpLoader } from '@ngx-translate/http-loader'
; export function HttpLoaderFactory(http:Http){ return new TranslateHttpLoader(http, './assets/i18n/', '.json'); } @NgModule({ declarations: [ AppComponent ], imports: [ ... TranslateModule.forRoot({ loader:{ provide:TranslateLoader, useFactory:HttpLoaderFactory, deps:[Http] } } ) ], providers: [], bootstrap: [AppComponent] })

在assets資料夾下新建i18n資料夾,並且新建兩個語言的json檔案。(比如zh-CN.json和en.json)

json檔案是key-value形式的,key值代表要翻譯的字串,value值為特定語言的翻譯結果,不用語言的檔案一般key值是相同的,只是value值不同。