Question

我目前正在使用Ionic 1.3.16版本。在这里，我需要在我的选择控件中选择多个选项。

这是我的离子HTML代码：

<div class="list">
    <label class="item item-input item-select">
        <div class="input-label">
            Lightsaber
        </div>
        <select>
            <option>Blue</option>
            <option selected>Green</option>
            <option>Red</option>
        </select>
    </label>
</div>

Answer 1

您错过了value选项中的select属性，因为当您选择选项时，它会反映到ng-model。另外要选择多个，您需要添加multiple选择中的属性。

<强>标记

<select ng-model="selectedValues" multiple>
    <option ng-repeat="option in options" value="{{option.value}}">{{option.name}}</option>
</select>
{{selectedValues}}

Answer 2

只需在选择字段中添加multiple属性。

<div class="list">
    <label class="item item-input item-select">
   <div class="input-label">
       Lightsaber
   </div>
   <select multiple="multiple">
        <option>Blue</option>
        <option selected>Green</option>
        <option>Red</option>
   </select>
</label>

Answer 3

使用ng-options绑定数据，这是

控制器中的

$scope.values=  [
   {id:1, name:"value1" }, 
   {id:2, name:"value2" }, 
   {id:3, name:"value3" }
   ];
$scope.selectedValues= []; //initial selections

并在视图中

<label class="item item-input item-select">

     <select multiple ng-model='selectedValues'
                    ng-options="a.name for a in values" >
     </select>
</label>
{{selectedValues}} <!-- to preview the selection -->

Ionic /如何从选择控件中选择多个选项（最多选择仅3个选项）？

3 个答案: