在ui-router中更改$ locale

Question

我想要实现的目标

在我们的angularjs中，我们使用angular-ui-bootstrap作为我们的日期选择器。我们希望我们的日期选择器本地化在用户的语言环境中，但我们不能动态地执行此操作，因为没有这样的API。从后端检索用户的语言环境，因此我需要在呈现主状态之前更改角度的语言环境。我的解决方案是调用一个服务，在我们的应用程序中注入正确的语言环境文件。

代码

injectorService：

;(function(module) {
'use strict';

function injector($q) {
    var body = document.getElementsByTagName('body')[0];
    return {
        addScript: function(url, async, cb) {
        return $q(function(resolve, reject) {
            var script = document.createElement('script');
            var loaded;
            script.type = 'text/javascript';
            script.setAttribute('src', url);
            script.onreadystatechange = script.onload = function() {
              if (!loaded) {
                if(cb && _.isFunction(cb)){
                    cb(null, 'ok');
                } else {
                    return resolve('ok');
                }
              }
              loaded = true;
              resolve('loaded');
            };
            script.onerror = function(error) {
                if(!error.isTrusted){
                    if(cb && _.isFunction(cb)){
                        cb(error, null);
                    } else {
                        reject(error);
                    }
                } 
            };
            body.appendChild(script);
        });
    }
  };
}

module.factory('Injector', injector);

}(angular.module('injector', [])));

在主要状态的启动中，我在解析部分中调用以下代码

            resolve: {
                    env : function(userService, Injector) {
                        return userService.getLocale()
                            .then(function(env) {
                                var userEnv = env;
                                var baseUrl = '/app/';
                                var angularSpecificLocale = '';

                                switch(userEnv.userlocale){
                                    case 'fr':  
                                  angularSpecificLocale = baseUrl + 'fr.js';
                                    break;
                                case 'ro':
                                  angularSpecificLocale = baseUrl + 'ro.js';
                                    break;
                                default:
                                  angularSpecificLocale = 'en';
                                  break;
                                }
                                // Don't add any locale files
                                if(angularSpecificLocale === 'en'){
                                    return userEnv;
                                } else {
                                  return Injector.addScript(angularSpecificLocale)
                                    .then(function() {
                                        return userEnv;
                                    });
                                }
                            });
                    }
                }

问题

问题是datepicker仍然没有本地化。我想我错过了最后一步，因为我在代码中添加了这个代码段

angular.injector(['ngLocale']).get('$locale')

我看到语言环境ID是正确的。如果不使用任何外部库，我将不胜感激。

谢谢：）

Answer 1

我正在使用angularDeferredBootstrap模块：

deferredBootstrapper.bootstrap({
    element: document.body,
    module: 'frontApp',
    resolve: {
        userLang: ['$http', function ($http) {
            return $http.get('/api/userLanguage');
        }]
    }
});

然后，您可以在应用程序的任何位置注入并使用userLang