如何使用 i18next 与 Anuglar 插件一起翻译？

Question

我将 i18next 与插件一起使用 https://github.com/i18next/ng-i18next。使用 angular 指令，它应该在页面上显示 "test" 和 "this is a test"。但它显示 "home.title" 和 "home.content"。检查控制台， json 文件正确加载，如果我使用 javascript DOM 可以显示正确的内容。

我的 json 文件：

{
    "home":{
        "title": "test",
        "content": "this is a test"
    }
}

html:

<div ng-app="myApp" ng-controller="myCtrl" class="home">
<h1 ng-i18next="home.title"></h1>
<p ng-i18next="home.content"></p>
</div>

脚本：

angular.module('jm.i18next')
.config(['$i18nextProvider',function($i18nextProvider){
  window.i18next.use(window.i18nextXHRBackend);

  $i18nextProvider.options = {
    debug: true,
    lng: 'en',
    fallbackLng: 'en',
    backend: {
      loadPath: '/locales/{{lng}}/{{ns}}.json'
    }
  };
}]);

angular.module('myApp', ['jm.i18next']).controller('myCtrl',['$scope', '$i18next',function($scope, $i18next){
}])

这是来自控制台的信息，我不知道最后一个错误是什么：

i18next::backendConnector：已加载语言的命名空间翻译 en 对象 {home: 对象}
i18next.min.js:2 i18next: languageChanged en
i18next.min.js:2 i18next: 初始化对象 {debug: true, ns: 数组[1], defaultNS: 数组[1], fallbackLng: 数组[1], fallbackNS: 错误…}
ng-i18next.min.js:1 未捕获类型错误：i.lng 不是函数

Answer 1

刚刚仔细检查，看起来 i18next 模块已升级到较新版本，因此有以下选项：

{
  compatibilityAPI: 'v1',
  compatibilityJSON: 'v1',
  // ...old options from v1
}

应该用于 i18next 以使 ng-i18next 插件正常工作。

P.S: 作为建议，我建议您使用 angular-translate 插件而不是这个插件，但这完全取决于您。

如何使用 i18next 与 Anuglar 插件一起翻译？

How to use i18next to translate with Anuglar plugin?

javascript

localization

internationalization

angularjs

i18next