在Backbone Application中重新加载骨干视图和i18n转换文件?

时间:2014-10-30 10:24:56

标签: javascript backbone.js requirejs rails-i18n

我在BackboneJS应用程序中使用i18n.js进行文本本地化。但是我需要重新加载应用程序中语言更改的文本翻译。我正在调用设置视图render()函数的语言更改,但不适合我,但重新加载index.html它的工作原理。那么如何重新加载翻译文件和视图以反映更改。以下是我试过的 -

应用bootstrap.js

var locale = {};

    locale.language = "en-us";//default

    locale.setLanguage = function (language) {
        localStorage.setItem('localLanguage', '' + language);
    };

    locale.getLanguage = function () {
        return localStorage.getItem('localLanguage');
    };
    require.config({
        config: {
            i18n: {
                locale: locale.getLanguage()
            }
        }
    });

settingView.js

define(['compiled/settingTmpl','i18n!nls/setting'
], function (SettingTmpl,setting) {
    'use strict';

    var SettingView = Backbone.View.extend({

        events: {
            "change #languageSelect": "changeLocale"
        },
        initialize: function () {
            WellNation.helper.log("Setting view initialize");
            this.render();
        },
        changeLocale: function (e) {
            var locale = e.currentTarget.value;
            WellNation.locale.setLanguage(locale);
            this.render();
        },
        render: function () {
            this.$el.html(SettingTmpl({speak:setting}));
            return this;
        }
    });

    return SettingView;
});

settingTmpl.handlebars

<div class="row">
        <label>{{speak.language}}</label>
        <select id="languageSelect">
            <option value="en-us">English (United States)</option>
            <option value="fr-fr">Francais (France)</option>
        </select>
    </div>

NLS / FR-FR / setting.js

  define({
      "language" : "langue"
    });

NLS / setting.js

  define({
      "root" : {
      "language" : "Language"
      },
      "fr-fr" : true // The system will accept French
    });

1 个答案:

答案 0 :(得分:1)

根据this SO问题和this github issue,无法在运行时使用i18n.js更改语言环境。

从官方文档中我们不清楚我们是否可以在运行时使用它:&#34; RequireJS将使用浏览器的navigator.language或navigator .userLanguage属性,用于确定要用于/ nls / colors的区域设置值,因此您的应用不必更改。如果您更喜欢设置区域设置,可以使用模块配置将区域设置传递给插件&#34;

所以在经过一些研究和散步之后,我发现i18n.js源代码的最佳解决方案是保持相同的结构并使用location.reload()