ionic國際化 - translte

最近在整理項目中的國際化json文件,覺得這個需要總結一下。

目前我們是用ionic做的項目,之前在網上找的方案,是直接用angular的translate服務,配了兩個json文件,一箇中文包,一個英文包,結果在ionic serve 的時候沒問題,但是打包在手機上運行的時候卻行不通,頁面顯示全是一堆國際化的key,簡直是醉了。

百度什麼的查了一下,發現這個問題是存在的,目測是ionic的bug。於是換了一種方案,如下:

(function () {
  'use strict';

  angular.module('service.T',[])
    .factory('T', ['$translate',T]);

  function T($translate) {
    var T = {
      T:function(key) {
        if(key){
          return $translate.instant(key);
        }
        return key;
      }
    }
    return T;
  }
})();
這是用$translate封裝的一個服務,方便使用,在controller中調用的時候直接T.T(KEY),就ok。

第一步:在app.js中進行初始化:
      //配置國際化(angular-translate)                //$translateProvider.useSanitizeValueStrategy('sanitize');
      //translate安全策略
      $translateProvider.translations('ZH', testProvider.$get().providerzh);
      $translateProvider.translations('EN', testProvider.$get().provideren);
      $translateProvider.preferredLanguage('EN');//首選語言
      $translateProvider.fallbackLanguage('EN');
第二部:在www目錄下新建一個i18n的文件夾,先創建一個一個js文件,我這裏命名問multilang.js,文件內容爲:
angular.module('dlp.constants',[])
    .provider('test', ['translationZH', 'translationEN', function (translationZH, translationEN) {
        this.$get = function () {
            return {
                providerzh: translationZH,
                provideren: translationEN
            };
        }
    }]);
第三步:在i18n目錄下創建兩個js文件,分別命名爲en.js和zh.js.這裏以en.js爲例:
angular.module('dlp.constants')
  .constant('translationEN',
    {
      "aboutUs": {
        "title": "About us",
        "name": "AlphaMoney",
        "version": "v1.0"
      }
  })
zh.js 同理
如果還想配置更多語言,請添加就可。
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章