Hot towel 中的多语言支持（Durandal 框架）答案

【问题标题】：Multi language support in Hot towel(Durandal framework)Hot towel 中的多语言支持（Durandal 框架）
【发布时间】：2013-09-28 04:01:00
【问题描述】：

我正在使用 Hot Towel 创建一个应用程序，它支持多种语言（例如英语、法语）

我参考了以下链接

Translating Views

Durandal localization example

我的问题是如何根据用户语言呈现应用程序视图。如果用户选择英文，则完整的应用程序应以英文显示内容。如何做到这一点

我在第二个链接中尝试过类似的东西。

define({
    'root': {
        welcome: 'Welcome!',
        flickr: 'Flickr'
    },
    'fr-fr': true,
    'es-es': true,
});

这是我必须为语言创建 单独的视图，还是我必须为内容创建单独的 App 文件夹

建议我一些最佳做法。

【问题讨论】：

你想在应用程序加载时改变它还是动态地改变它
是的，根据用户选择的语言，应用程序的内容应该动态变化。
我已经发布了答案。希望它会工作
Durandal (knockout) app with multilanguage support的可能重复

标签： durandal hottowel multilingual i18next

【解决方案1】：

如果您的项目很大，我不建议您使用单独的视图或单独的文件夹。您可以只创建一个 labels 文件，如果您使用 lib like knockout，只需将这些标签数据绑定一次（文本：xxxx）。此外，您还可以使用 i18n 来管理标签。使用选定的语言只需将特定语言文件加载到您的视图模型。

EDIT1： 我从未遇到过完整的示例或教程。所以我的做法是：

使用 i18n 等工具获取 密钥配对字典文件，用于 html 中的标签和一些 javascript 代码（如消息）中。
然后我通过增加视图的剔除视图模型和模块的变量来手动索引这些标签。这是我等待更好解决方案的最后选择。希望这能有所帮助！

【讨论】：

能否给我一些工作示例或教程链接

【解决方案2】：

你可以做一些这样的事情。如果您需要进行大量区域设置更改，您可以更改 APP 文件夹，您可以使用以下方法

@{

        string strAcceptLanguage;


        strAcceptLanguage = System.Configuration.ConfigurationManager.AppSettings["Locale"].ToString();

        if (strAcceptLanguage == "en-us")
    {
         @Scripts.Render("~/Scripts/vendor.js")
        <script type="text/javascript" src="~/Scripts/require.js" data-main="en-US/main"></script>

    }
        else if (strAcceptLanguage == "es-es")
    {
         @Scripts.Render("~/Scripts/vendor.js")
        <script type="text/javascript" src="~/Scripts/require.js" data-main="en-UK/main"></script>

    }

    else      if (strAcceptLanguage == "fr-fr")
    {
         @Scripts.Render("~/Scripts/vendor.js")
        <script type="text/javascript" src="~/Scripts/require.js" data-main="AUZ/main"></script>

    }



}

在 Index.cshtml 中你可以使用上面的代码，并且你需要在 Webconfig 文件中有值

<add key="Locale" value="en-us" />

并且在 SPA 页面中，每当用户尝试通过按下按钮或任何类型的选项来更改区域设置时，您必须触发一个事件来调用 AJAX 帖子以评估 REST api 以更新给定的区域设置值网络配置文件

changeLocale: function (val) {

            var name = JSON.stringify({
                locale: val
            });

            $.ajax({
                cache: false,
                url: "http://localhost:49589/api/Locale",
                type: "POST",
                dataType: "json",
                data: name,
                contentType: "application/json; charset=utf-8",
                processData: false,
                success: function (json) {


                    alert(json);
                    location.reload();

                },
                error: function (json) {
                    alert("error" + JSON.stringify(json));
                }
            });

上面的代码你要写在shell.js中，shell.html有如下代码

 <div class="btn-group" data-toggle="buttons-radio">
                <button type="button" class="btn btn-primary" data-bind="click: changeLocale.bind($data, 'en-us')">English</button>
                <button type="button" class="btn btn-primary" data-bind="click: changeLocale.bind($data, 'es-es')">French</button>
                <button type="button" class="btn btn-primary" data-bind="click: changeLocale.bind($data, 'fr-fr')">Japanese</button>
            </div>

其他的api也是这样的

 [HttpPost]
        public string ChangeLocale(Locale l)
        {
            ConfigurationManager.AppSettings["Locale"] = l.locale;

            return "success";

        }

希望这会有所帮助

【讨论】：