0
我想實現的目標
在我們的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是正確的。我希望得到一些幫助,而無需使用任何外部庫
謝謝:)
Thanx的答覆!我更喜歡一個解決方案,而不必在我的項目中添加一個庫,特別是現在我認爲我真的接近解決方案:) –