angular-translate

发布时间:2019-06-26 发布网站:脚本宝典
脚本宝典收集整理的这篇文章主要介绍了angular-translate脚本宝典觉得挺不错的,现在分享给大家,也给大家做个参考。
//index.config.js

  angular
    .module('app')
    .config(config);

  /** @ngInject */
  function config($logProvider, $translateProvider, $translatePartialLoaderProvider) {
    // Enable log
    $logProvider.debugEnabled(true);

    $translatePartialLoaderProvider.addPart('home');
    $translateProvider.useLoader('$translatePartialLoader', {
      urlTemplate: "app/i18n/{part}/{lang}.json"
    });
    $translateProvider.preferredLanguage('zh_cn').fallbackLanguage('en');

    $translateProvider.useMissingTranslationHandlerLog();

    $translateProvider.registerAvailableLanguageKeys(['zh_cn', 'en', 'zh_hant'], {
      'en_*': 'en',
      'zh_tw': 'zh_hant',
      'zh_hk': 'zh_hant'
    });

    $translateProvider.useSanitizeValueStrategy('escaped');
    $translateProvider.useCookieStorage();
  }
  
  // i18n/home/en.json
  {
    "TITLE": "home",
    "DESCRIPTION": "This is home page",
    "ITEM1": {
      "TITLE": "item1",
      "INFO": "this is item1"
    },
    "ITEM2": {
      "TITLE": "item2",
      "INFO": "this is item2"
    }
  }
  // i18n/home/zh_cn.json
  {
    "TITLE": "首页",
    "DESCRIPTION": "这是首页",
    "ITEM1": {
      "TITLE": "项目一",
      "INFO": "这是项目一"
    },
    "ITEM2": {
      "TITLE": "项目二",
      "INFO": "这是项目二"
    }
  }
  // home.controller.js
  /** @ngInject */
  function HomeController(homeData) {
    var vm = this;
    vm.items= [
      {
        title: 'ITEM1.TITLE',
        info: 'ITEM1.INFO'
      },
      {
        title: 'ITEM2.TITLE',
        info: 'ITEM2.INFO'
      }
    ];
  }
  // home.html
  <html>
    <head>
      <title data-translate="TITLE"></title>
    </head>
    <body>
      <div data-translate="DESCRIPTION"></div>
      <div data-ng-repeat="item in ::vm.items">
        <h3 data-translate="{{item.title}}"></h3>
        <p data-translate="{{item.info}}"></p>
      </div>
    </body>
  </html>

脚本宝典总结

以上是脚本宝典为你收集整理的angular-translate全部内容,希望文章能够帮你解决angular-translate所遇到的问题。

如果觉得脚本宝典网站内容还不错,欢迎将脚本宝典推荐好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。
标签: