Question

如果我有这个HTML代码：

<select multiple>
    <option selected>
        one
    </option>
    <option selected>
        two
    </option>
</select>

然后我看到默认选择了两个选项。

但是，如果我通过angular创建html，则只选择最后一个元素：

<select
multiple
class="form-control"
ng-model="mymodel">
<option selected="selected" ng-repeat="item in myarr.units" value="  {{item.id}}">{{item.name}}</option>
</select>

当我看到生成的html时，我看到了：

<select class="form-control ng-pristine ng-untouched ng-valid ng-empty"  multiple="" ng-model="mymodel">
<option selected="selected" ng-repeat="item in mymodel" value="2" class="ng- binding ng-scope">One</option>
<option selected="selected" ng-repeat="item in mymodel" value="3" class="ng-binding ng-scope">Two</option>
</select>

因此两个元素都被“选中”，但在GUI中只选择了最后一个元素。我错过了什么吗？

Answer 1

您应该使用ng-model绑定所选值，而不是使用选项选择中的选定值。

Plunkr link

    <select name="multipleSelect" id="multipleSelect" ng-model="data" multiple=""
        ng-options="item.id as item.name for item in myarr.units"></select>

$scope.data = [1, 2]; // selected value

html multiple select默认情况下无法使用angular选择多个

1 个答案: