Angular translate get default solution from server
I am using angular-translate to support multiple languages. I have 4 json languages in local. (ru.json, ru, json, is.json, jp.json) and I wrote the code as below in app config
app.config(['$stateProvider' , '$urlRouterProvider', '$translateProvider', 'TENANT_KEY', 'LANG_KEY',
function ($stateProvider, $urlRouterProvider, $translateProvider, TENANT_KEY) {
'use strict';
...
$translateProvider.useStaticFilesLoader({
prefix: '/assets/languages/',
suffix: '.json'
});
$translateProvider.preferredLanguage('en');
...
}]);
Here is the question: I want the application to start with the server side language, for example, the last time I selected "ru" as the current language, and the next time I open the application, the default language will be "ru".
I wrote localService to remember the language selection, but in app.config we cannot use the service, how can I work with it?
angular.module('storm.common')
.constant('LANG_KEY', 'lang')
.service('LocaleService', ['PersistenceService', 'LANG_KEY', '$window', '$translate',
function (PersistenceService, LANG_KEY, $window, $translate) {
'use strict';
// 'is' is used for i18n team for their testing !!!
var supportedLocale = ['en', 'ja', 'ru', 'is'];
this.set = function (locale) {
if (!locale) {
if (PersistenceService.get(LANG_KEY)) {
locale = PersistenceService.get(LANG_KEY);
} else {
locale = ($window.navigator.language || 'en').replace(/^(en)-.*/, '$1');
}
}
if (supportedLocale.join(',').indexOf(locale) === -1) {
locale = 'en';
}
PersistenceService.set(LANG_KEY, locale);
$translate.use(locale);
// moment.locale(locale);
};
this.get = function () {
return PersistenceService.get(LANG_KEY) || 'en';
};
}
]);
source to share
You cannot enter your services inside a block config
. Use a block instead run
.
The explanation is explained here: how to inject dependency in module.config (configFn) in angular
The code should look like this:
app.run(['$translateProvider', 'LocaleService',
function($translateProvider, LocaleService){
'use strict';
....
$translateProvider.useStaticFilesLoader({
prefix: '/assets/languages/',
suffix: '.json'
});
$translateProvider.preferredLanguage(LocaleService.get());
}]);
source to share