AngularJS:动态区域设置

时间:2015-07-29 16:23:52

标签: angularjs internationalization locale angular-translate

我使用Angular Dynamic localeAngular-Translate进行国际化和本地化( i18n )。效果很好。

我喜欢 angular-translate 的想法,可以在不刷新页面的情况下更改语言。

  • 是否可以对角度动态区域设置执行相同的操作?如果可能的话,我怎么能得到这个?

angular-translate中的所有单词都会自动更改,但不会更改angular_locale( datapicker等)中的单词,用户需要刷新页面。

谢谢!

1 个答案:

答案 0 :(得分:10)

如果您没有绝对必要使用Angular Dynamic locale,您可以像这样创建自己的LocaleFactory:

 factory('LocaleFactory', function ( $locale, $translate) {
    var locales = {
        nl: {
            "DATETIME_FORMATS": {
                "AMPMS"     : [
                    "AM",
                    "PM"
                ],
                "DAY"       : [
                    "zondag",
                    "maandag",
                    "dinsdag",
                    "woensdag",
                    "donderdag",
                    "vrijdag",
                    "zaterdag"
                ],
                "MONTH"     : [
                    "januari",
                    "februari",
                    "maart",
                    "april",
                    "mei",
                    "juni",
                    "juli",
                    "augustus",
                    "september",
                    "oktober",
                    "november",
                    "december"
                ],
                "SHORTDAY"  : [
                    "zo",
                    "ma",
                    "di",
                    "wo",
                    "do",
                    "vr",
                    "za"
                ],
                "SHORTMONTH": [
                    "jan.",
                    "feb.",
                    "mrt.",
                    "apr.",
                    "mei",
                    "jun.",
                    "jul.",
                    "aug.",
                    "sep.",
                    "okt.",
                    "nov.",
                    "dec."
                ],

                "fullDate"  : "EEEE d MMMM y",
                "longDate"  : "d MMMM y",
                "medium"    : "d MMM y HH:mm:ss",
                "mediumDate": "d MMM y",
                "mediumTime": "HH:mm:ss",
                "short"     : "dd-MM-yyyy HH:mm",
                "shortDate" : "dd-MM-yyyy",
                "shortTime" : "HH:mm"
            },
            "NUMBER_FORMATS"  : {
                "CURRENCY_SYM": "\u20ac",
                "DECIMAL_SEP" : ",",
                "GROUP_SEP"   : ".",
                "PATTERNS"    : [
                    {
                        "gSize"  : 3,
                        "lgSize" : 3,
                        "macFrac": 0,
                        "maxFrac": 3,
                        "minFrac": 0,
                        "minInt" : 1,
                        "negPre" : "-",
                        "negSuf" : "",
                        "posPre" : "",
                        "posSuf" : ""
                    },
                    {
                        "gSize"  : 3,
                        "lgSize" : 3,
                        "macFrac": 0,
                        "maxFrac": 2,
                        "minFrac": 2,
                        "minInt" : 1,
                        "negPre" : "\u00a4\u00a0",
                        "negSuf" : "-",
                        "posPre" : "\u00a4\u00a0",
                        "posSuf" : ""
                    }
                ]
            }
        }
    };

    return {
        setLocale: function (key) {
            $translate.use(key);
            angular.copy(locales[key], $locale);
        }
    };
});

同样,您也可以添加其他本地人

调用setLocale更改区域设置

run(function (LocaleFactory) {
    LocaleFactory.setLocale('nl');
});

当您的语言环境发生变化时,您可以通过提供语言环境键作为参数来调用setLocale。它会立即改变您的语言环境