Question

我有以下代码来显示带有一些选项的多选。所有选项均使用翻译过滤器（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将找不到所选项目的匹配项（'Orange'！='Apelsin'），因此它将添加空的，我将最终得到：

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

我怎样才能避免语言的变化扰乱我的选择列表？我想在每个选项上加上一个ID，这样它就会尝试匹配它而不是翻译的名称。

Answer 1

将翻译后的名称保留在标记内，但也使用未翻译的名称作为选项的值属性。

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

到

<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

在语言更改时为选定选项添加了空白选项

1 个答案: