在ui-router中更改$ locale

Question

我想实现的目标

在我们的angularjs中，我们使用angular-ui-bootstrap作为我们的datepickers。我们希望我们的datepickers能够在用户的语言环境中本地化，但我们不能动态地做到这一点，因为没有这样的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