基于Semantic-UI文档,https://semantic-ui.com/modules/dropdown.html#multiple-selections
我在angular2模板中有以下代码:
<select id="thickness" name="thick" [(ngModel)]="form.thickness" multiple="multiple" class="ui multiple dropdown selection">
<option value="">Выбрать</option>
<option value="100">100 mm</option>
<option value="150">150 mm</option>
<option value="200">200 mm</option>
<option value="250">250 mm</option>
<option value="300">300 mm</option>
<option value="375">375 mm</option>
<option value="400">400 mm</option>
</select>
我想从Select
到角度模型form.thickness
获得一系列选定值
但是,我得到空数组。在ngOnInit
里面我有$('#thickness').dropdown();
console.log($('#thickness').dropdown('get value'));
给出空阵;
如何从下拉列表中选择多个值?
建议您的代码如下所示:
<div class="ui multiple selection dropdown">
<i class="dropdown icon"></i>
<div class="default text">Tag Multiple Categories</div>
<select multiple="" id="multi-select">
<option value="">Categories</option>
<option value="datastructure">Data Structure</option>
<option value="stack">Stack</option>
<option value="queue">Queue</option>
</select>
</div>
</div>
以下内容将返回一系列选定值:
$("#multi-select").dropdown("get value")
输出:
[“堆叠”,“队列”]
注意:
确保html中没有隐藏的输入字段,否则返回字符串值而不是值数组
通过重写代码解决:
<div id="thickness" class="ui multiple selection dropdown">
<input name="thick" type="hidden">
<i class="dropdown icon"></i>
<div class="default text">Выбрать</div>
<div class="menu">
<div class="item" data-value="100">100 mm</div>
<div class="item" data-value="150">150 mm</div>
<div class="item" data-value="200">200 mm</div>
<div class="item" data-value="250">250 mm</div>
<div class="item" data-value="300">300 mm</div>
<div class="item" data-value="375">375 mm</div>
<div class="item" data-value="400">400 mm</div>
</div>
</div>
你仍然可以使用select。以下是在Aurelia中执行此操作的方法:form.html:
<select id="thickness" name="thick" multiple="" class="ui multiple dropdown selection" value.bind="thickness_selected">
<option value="">Выбрать</option>
<option value="100">100 mm</option>
<option value="150">150 mm</option>
</select>
form.ts:
export class form {
thickness_selected: number[] = [];
submit() {
const self = this;
for (let id of self.thickness_selected) {
console.log(id);
}
}
}