Пустая опция добавлена ​​для выбранной опции по мере изменения языка

У меня есть следующий код, чтобы показать множественный выбор с некоторыми параметрами. Все варианты переводятся с помощью фильтра перевода (angular-translate).

<select multiple class="form-control" ng-model="field.value">
    <option ng-repeat="option in field.options()">{{option.name | translate}}</option>
</select>

Это произведет что-то вроде этого:

['Orange', 'Apple', 'Banana']

Если выбраны некоторые параметры и изменен язык, angularjs не найдет совпадений для выбранных элементов («Оранжевый»! = «Апельсин»), поэтому он добавит пустые, и в итоге я получу:

[' ', ' ', 'Apelsin', 'Äpple', 'Banan']

Как я могу избежать того, что изменение языка испортит мой список выбора? Я хотел бы указать идентификатор для каждой опции, чтобы он пытался сопоставить его вместо переведенного имени.


person Markus Johansson    schedule 11.06.2014    source источник
comment
что в field.options()?   -  person vusan    schedule 11.06.2014
comment
В моем примере фрукты, так: ['Апельсин', 'Яблоко', 'Банан']   -  person Markus Johansson    schedule 11.06.2014


Ответы (1)


Сохраняйте переведенное имя внутри тега, но также используйте непереведенное имя в качестве атрибута значения опции.

<option ng-repeat="option in options">{{option | translate }}

to

<option value="{{option}}" ng-repeat="option in options">{{option | translate }}

Это не зависит от Angular http://www.w3schools.com/tags/att_option_value.asp.

У меня была такая же проблема, и это решило ее для меня...


Кроме того, установите какой-либо параметр по умолчанию в контроллере.

Шаблон

ng-model="field.value"

Контроллер

$scope.field.value = options[0] // First will be selected by default
person Pavel 'Strajk' Dolecek    schedule 11.06.2014
comment
Я помечаю этот ответ как правильный, но он должен быть value={{option.name}} или value={{option.id}}, что я и получил. Спасибо! :) - person Markus Johansson; 12.06.2014
comment
Да, я упростил код, чтобы сделать его более общим. Я рад, что это помогло :) - person Pavel 'Strajk' Dolecek; 12.06.2014
comment
Однако если вы забудете добавить {{}}, все значения будут установлены в строковую опцию. :) - person Markus Johansson; 13.06.2014