Ionic Internationalization-Translte_angular

Recently in the process of organizing the project's internationalization JSON file, feel this need to sum up.

At present, we are using ionic to do the project, the previous search on the Internet, is the direct use of angular translate services, with two JSON files, a Chinese bag, an English bag, the results in the ionic serve when no problem, but packaged in the mobile phone when the run is not workable , the page shows all is a bunch of international key, it is drunk.

Baidu or something check, found that the problem is there, the visual is Ionic bug. Then a scheme was changed, as follows:

(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;
  }
}) ();

This is a service with the $translate package, easy to use, in the controller call when the direct t.t (KEY), OK. The

first step: Initialize in App.js:

      Configure internationalization (Angular-translate)                //$translateProvider. Usesanitizevaluestrategy (' sanitize ');
      Translate security Policy
      $translateProvider. Translations (' en ', testprovider. $get (). Providerzh);
      $translateProvider. Translations (' EN ', Testprovider. $get (). Provideren);
      $translateProvider. Preferredlanguage (' en ');//Preferred Language
      $translateProvider. Fallbacklanguage (' en ');

Part II: In the WWW directory to create a new i18n folder, first created a JS file, I am here to name the Multilang.js, the contents of the file is:

Angular.module (' dlp.constants ', [])
    . Provider (' Test ', [' Translationzh ', ' Translationen ', function ( Translationzh, Translationen) {this
        . $get = function () {return
            {
                Providerzh:translationzh,
                Provideren:translationen
            }}
    ]);

Step three: Create two JS files in the i18n directory, named En.js and Zh.js respectively. Here take En.js as an example:

Angular.module (' dlp.constants ')
  . Constant (' Translationen ',
    {
      "AboutUs": {"
        title": "About Us",
        ' name ': ' Alphamoney ', '
        version ': ' v1.0 '
      }
  }

Zh.js likewise
if you want to configure more languages, add it.