javascript - RequireJS:如何向路径添加前缀

标签 javascript html knockout.js requirejs single-page-application

我正在使用 Knockout.js V3 和 RequireJS 开发 SPA。

我有这样写的 ko 组件:

define(['text!settings.html'],
    function( htmlString) {
        'use strict';

       function SettingsViewModel(params) {
           ...
       }
        // Return component definition
        return {
            viewModel: SettingsViewModel,
            template: htmlString
        };
    });

现在我想支持本地化,为此我为每种支持的语言复制了 html,例如:

en/settings.html
de/settings.html
se/settings.html

我想让用户更改语言并使用新语言刷新应用程序,是否可以指示需要文本插件将语言前缀添加到所有 html,所以当我编写时:

text!settings.html

它实际上会加载:

text!de/settings.html

最佳答案

不确定是否可以让文本插件为网址添加前缀。您可以做的是创建一个自定义模板加载器:

var templateFromLanguageUrlLoader = {
    loadTemplate: function(name, templateConfig, callback) {
        if (templateConfig.languageUrl) {
            // Language from config or default language
            var lang = templateConfig.lang || 'de';
            var fullUrl = lang + '/' + templateConfig.languageUrl;
            $.get(fullUrl, function(markupString) {
                ko.components.defaultLoader.loadTemplate(name, markupString, callback);
            });
        } else {
            // Unrecognized config format. Let another loader handle it.
            callback(null);
        }
    }
};

// Register it
ko.components.loaders.unshift(templateFromLanguageUrlLoader );

然后你的组件看起来像这样:

define([],
    function() {
        'use strict';

       function SettingsViewModel(params) {
           ...
       }
        // Return component definition
        return {
            viewModel: SettingsViewModel,
            template: { 
                languageUrl: 'settings.html',
                language: 'nl' // overwrite default
            }
        };
    });

关于javascript - RequireJS:如何向路径添加前缀,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27248043/

相关文章:

php - 测试特定元素节点中的字符串

php - html按钮在表单上显示为输入框

javascript - 使用 REST API 从本地主机进行开发时处理 CORS - Streamlabs API

php - 仅需要为注册成员(member)显示证书(图像)的功能

javascript - Node.js 中的 $2y bcrypt 哈希

json - 在推送到 ko.observableArray 之前格式化 JSON 日期

javascript - 多屏应用的两侧数据绑定(bind)javascript库使用

javascript - 如果用户返回,Onbeforeunload 不起作用

html - Bootstrap 下拉菜单溢出 html 正文

javascript - 将 Base2 与 KnockoutJS View 模型结合使用