如何在 Framework7 ajax 加载页面上加载 i18next 翻译？答案

【问题标题】：How to load i18next translation on Framework7 ajax loaded page?如何在 Framework7 ajax 加载页面上加载 i18next 翻译？
【发布时间】：2016-09-08 12:29:38
【问题描述】：

我正在使用 i18next jquery 版本来本地化我的 framework7 代码中的文本。如果我单击按钮更改语言（使用 localstorage 保存语言选项），它适用于每个文件。但是如果我在视图中加载另一个文件，例如关于页面，它就不起作用。

我是 javascript 的新手，我已经使用教程和其他帮助完成了这项工作。

如何将翻译应用到视图中加载的每个页面，而无需点击按钮来更改它？

这是我的 i18next 函数，带有翻译 (language.js)：

var itemslang = {
    "en": {
        "translation": {
          /* MENU */
          "About-Framework7": "About-Framework7",
          "Welcome-to-Framework7": "Welcome-to-Framework7",
        }
    },
        "br": {
        "translation": {
          /* MENU */
          "About-Framework7": "Sobre o Framework7",
          "Welcome-to-Framework7": "Bem Vindo ao Framework7",
        }
    }
};

$(document).ready(function() {
    var language = "en";
    if (localStorage.getItem("language") != null)
        language = localStorage.getItem("language");

    i18n.init({
        lng: language,
        resStore: itemslang,
        fallbackLng: "en"
    }, function(o) {
        $(document).i18n()
    }), $(".lang").click(function() {
        var o = $(this).attr("data-lang");

        localStorage.setItem("language", o);

        i18n.init({
            lng: o
        }, function(o) {
            $(document).i18n()
        })
    })
});

这里是更改语言的按钮：

<button class="lang en" data-lang="en">EN</button>
<button class="lang br" data-lang="br">BR</button>

【问题讨论】：

标签： javascript jquery ajax html-framework-7

【解决方案1】：

找到答案了！

我忘记在 index.html 中加载文件 my-app.js

其中有翻译工作的代码：

$$(document).on('pageInit', function (e) {
  $(document).i18n();
});

这将在每个加载的视图中应用翻译。

【讨论】：