перевести только первый вариант выбора

Я создаю приложение с AngularJS.

Приложение мультиязычное. Вы можете изменить язык из раскрывающегося списка (выберите элемент HTML).

У меня есть следующий выбор:

<select id="filter" class="form-control" ng-model="filter" ng-change="ref()" ng-options="rt.text | translate for rt in rts track by rt.value">
</select>

Вы можете видеть, что к text применен фильтр, то есть translate. Это часть модуля Angular Translate.

Мой выпадающий список заполняется динамически из базы данных и имеет дополнительную опцию, которая является опцией по умолчанию.

Я хочу перевести параметр по умолчанию при изменении языка, и я не знаю, как это сделать.

Проблема с текущим решением заключается в том, что если у него есть какой-либо другой вариант с многоязычными переводами, они будут переведены. Я не хочу этого, все, что я хочу, это перевести только вариант по умолчанию.

Когда я добавляю параметр по умолчанию, я устанавливаю его на index=0 с помощью value='all' и text='Show all'.

Структура РТС:

[
 {
  value:'all',
  text: 'Select_all'
 },
 {
  value:'1',
  text: 'option 1'
 },
 {
  value:'2',
  text: 'Option 2'
 }
]

angularjs angular-translate
person tzortzik    schedule 26.05.2015    source источник
comment
Вместо того, чтобы выполнять перевод как фильтр, почему бы не сделать это в контроллере, когда вы получите свои варианты?   -  person Esteban Felix    schedule 26.05.2015
comment
Я не могу этого сделать, потому что я управляю языком внутри другого контроллера. Поэтому, когда я меняю язык в текущем контроллере, я не вижу способа перевести значение.   -  person tzortzik    schedule 26.05.2015
comment
Откуда rts? Можете ли вы показать пример того, как вы получаете параметры в этой директиве?   -  person Esteban Felix    schedule 26.05.2015
comment
Я добавил структуру JSON для rts.   -  person tzortzik    schedule 26.05.2015

Ответы (2)


arrow_upward
1
arrow_downward

Почему бы просто не перевести только эту опцию по пути с вашего сервера? Я предполагаю, что ваш контроллер выглядит примерно так. Кроме того, вам нужно послушать $translateChangeSuccess, чтобы вы знали, когда меняется язык:

module.controller('RtsCtrl', function ($rootScope, $scope, $translate, rtsService) {
    var translateDefaultOption = function (options) {
        options[0].text = $translate(options[0].text);
        $scope.rts = options;
    };

    var getTranslatedOptions = function () {
        rtsService
                .getOptions()/*<- Might want to cache this or not*/
                .then(translateDefaultOption);
    };

    getTranslatedOptions();

    var cleanUpOnDestroy = $rootScope.$on('$translateChangeSuccess', getTranslatedOptions);
    $scope.on('$destroy', cleanUpOnDestroy);
});

Очевидно, я не знаю, как на самом деле работает ваш контроллер, так что это просто грубый пример.

person Esteban Felix    schedule 26.05.2015
comment
Если я использую это решение, когда я меняю язык в раскрывающемся списке, он не переводит эту опцию. - person tzortzik; 26.05.2015
comment
@tzortzik Является ли фильтр translate созданным вами или исходящим от angular-translate? Как контроллер, устанавливающий язык, связан с контроллером, обрабатывающим эту директиву option? - person Esteban Felix; 26.05.2015
comment
Это происходит от angular-translate. MyController в данный момент ничего не знает о LanguageController. Все переводы из приложения выполняются с помощью {{'text'"translate}}. - person tzortzik; 26.05.2015
comment
@tzortzik Посмотрите мое обновление, вам нужно послушать $translateChangeSuccess. - person Esteban Felix; 26.05.2015

arrow_upward
1
arrow_downward

EDIT: к сожалению, это будет работать только в том случае, если значение параметра пусто, согласно документам ngOptions

Удалите параметр по умолчанию из ng-options, например. используя rts.slice(1).

Добавьте его, используя тег <option> внутри файла <select>.

<select ... ng-options="...">
     <option value="">
        {{ rts[0].text | translate }}
     </option>
</select>

Тогда у вас не будет проблем с переводом только опции по умолчанию.

person Sulthan    schedule 26.05.2015
comment
Можете ли вы привести более подробный пример? Как добавить параметр в качестве первого элемента выбора с помощью Angular? - person tzortzik; 26.05.2015
comment
Мне нравится это решение! Хотя я все еще не уверен, будет ли это работать при смене языка, так как нет часов, привязанных к translateLanguage. - person Esteban Felix; 26.05.2015
comment
@EstebanFelix Я бы, наверное, предпочел, чтобы вы сами решили. Просто хотел добавить это как еще один вариант. - person Sulthan; 26.05.2015
comment
Я попробовал ваш пример, и он не будет работать из-за ng-options. Когда вы меняете массив, он автоматически заменяет все параметры в выборе, даже по умолчанию. Так что в моем случае он никогда не появится. - person tzortzik; 26.05.2015
comment
@tzortzik Хорошо, ты прав. Вы можете добавить один option, но он должен иметь пустое значение. - person Sulthan; 26.05.2015