Localization and language translate

Question

i use angular-translate, and its working correct. I have select box for select language.

.config(['$translateProvider', function($translateProvider) {
    $translateProvider.translations('en', translationsEN);
$translateProvider.translations('hr', translationsCRO);
$translateProvider.preferredLanguage('en');
$translateProvider.fallbackLanguage('en');
 $translateProvider.useSanitizeValueStrategy('escape');

 $translateProvider.useSanitizeValueStrategy('sanitize'); */
}]);

Here is ctrl for switch language

$scope.changeLanguage = function (langKey) {
$translate.use(langKey);
};

and in view, and this working.

<ul class="dropdown-menu">
                <li><a ng-click="changeLanguage('hr')" translate="BUTTON_LANG_CRO"></a></li>
                <li><a ng-click="changeLanguage('en')" translate="BUTTON_LANG_EN"></a></li>
            </ul>

Problem is, i want to use angular-i18n for locale. and change on same select box, same like for change language on page. If i select english, change language and localization...same for croatian etc.

I add .config file

.config(function(tmhDynamicLocaleProvider) {
tmhDynamicLocaleProvider.localeLocationPattern('bower_components/angular-i18n/angular-locale_{{locale}}.js');
});

and in controller i add

$rootScope.availableLocales = {
  'en': 'English',
  'hr': 'Hrvatski'};
$scope.changeLanguage('hr');
$rootScope.model = {selectedLocale: 'en'};
$rootScope.$locale = $locale;
$rootScope.changeLocale = tmhDynamicLocale.set;

    sveKlupeServiceFactory.query(function (res) {
        $scope.klupe = res.smart_benches;
    });

and, in view works if i add this

<select ng-model="model.selectedLocale" ng-options="key as value for (key, value) in availableLocales" ng-change="changeLocale(model.selectedLocale)"></select>

But this give me second select box. i try add on first select box something like this, but this not working

<li><a ng-model="model.selectedLocale" ng-click="changeLanguage('hr'); changeLocale(model.selectedLocale)" translate="BUTTON_LANG_CRO"></a></li>
<li><a ng-model="model.selectedLocale" ng-click="changeLanguage('en'); changeLocale(model.selectedLocale)" translate="BUTTON_LANG_EN"></a></li>

If someone can help me pls, thnx

Arter Arter · Accepted Answer · 2016-07-21T09:58:35

I fix this, i set on

<li><a ng-model="model.selectedLocale" 
    ng-click="changeLanguage('hr'); 
      changeLocale('hr')"  //here i set 'hr'
         translate="BUTTON_LANG_CRO"></a>    </li>
<li><a ng-model="model.selectedLocale"  
    ng-click="changeLanguage('en'); 
      changeLocale('en')" //here i set 'en'
         translate="BUTTON_LANG_EN"></a></li>

Localization and language translate

1 Answers