Question

使用angularJS-translate模块时，我遇到了类似的问题。

参考类似问题的网址： i18n using Angular Translate StaticFilesLoader

这是我的JS代码：

var app = angular.module('myApp', ['pascalprecht.translate']);

app.config(function ($translateProvider) {

  $translateProvider.useStaticFilesLoader({
    prefix: 'locale-',
    suffix: '.json'
  });
  $translateProvider.preferredLanguage('en_US');

});

app.controller('langController', ['$scope', '$translate', function ($scope, $translate) {

  $scope.switchLanguage = function (key) {
    $translate.use(key);
  };
}]);

html：

<!doctype html>
<!--[if lt IE 7]> <html class1="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
<!--[if IE 7]>    <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]>    <html class="no-js lt-ie9"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js" lang="en"> <!--<![endif]-->
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="Description" content="angular translate brings internationalization (i18n) and localization (l10n) to your Angular apps!">
    <meta name="fragment" content="!">
    <title>angular translate - i18n for your Angular apps, made easy.</title>

    <script src="js/angular.js"></script>
    <script src="js/angular-translate.min.js"></script
    <script src="https://rawgithub.com/PascalPrecht/bower-angular-translate-loader-static-files/master/angular-translate-loader-static-files.js"></script>  
    <script src="app.js"></script>
  </head>

  <body ng-app="myApp">


            <div class="span4">
              <div class="well">
                  <h2 translate>Hello</h2>
                  <p translate>This is a paragraph</p>
                  <p translate>Welcome to Hello world!</P>
              </div>
              <div ng-controller="langController">
                <button class="btn" ng-click="changeLanguage('en')" translate="BUTTON_LANG_EN" class="ng-scope">english</button>
                <button class="btn" ng-click="changeLanguage('de')" translate="BUTTON_LANG_DE" class="ng-scope">german</button>

              </div>
              <hr>

              <div ng-controller="langController">
                <select ng-model="lang" ng-selected="selected">
                  <option disabled="disabled" selected="selected">Select Language</option>  
                  <option ng-click="changeLanguage('en')" class="ng-scope">English</option>
                  <option ng-click="changeLanguage('de')" class="ng-scope">German</option>
                </select>
              </div>
            </div>
   </body>
</html>

区域设置en_US.json：

"TITLE":"Hello",
"FOO":"This is a paragraph.",
"BUTTON_LANG_EN":"english",
"BUTTON_LANG_DE":"german",
"TEXT":"Welcome to Hello world!"

区域设置de_DE.json：

"TITLE":"Hallo",
"FOO":"Dies ist ein Paragraph.",
"BUTTON_LANG_EN":"englisch",
"BUTTON_LANG_DE":"deutsch",
"TEXT":"herzlich willkommen auf Hallo Welt!"

我已将.js，.html，locale-en_US.json，locale-de_DE.json语言文件放在同一个文件夹中，但我无法获得所需的输出，在Firefox控制台中收到错误：错误：[ $ injector：unpr]未知提供者：$ translateStaticFilesLoaderProvider＆lt; - $ translateStaticFilesLoader。

你能帮我解决这个问题吗？

谢谢，科坦

Answer 1

更改ng-click="changeLanguage('en')"
with：ng-click="changeLanguage('en_EN')"

更改ng-click="changeLanguage('de')"
with：ng-click="changeLanguage('de_DE')"

语言json文件是

{
"TITLE":"Hallo",
"FOO":"Dies ist ein Paragraph.",
"BUTTON_LANG_EN":"englisch",
"BUTTON_LANG_DE":"deutsch",
"TEXT":"herzlich willkommen auf Hallo Welt!"
}

Answer 2

你需要索引文件中的这个js

<script src="https://rawgithub.com/PascalPrecht/bower-angular-translate-loader-static-files/master/angular-translate-loader-static-files.js"></script>

i18n使用Angular Translate StaticFilesLoader

2 个答案: