如何从Angular中的select中选择多个值

时间:2017-05-31 22:08:56

标签: angular angular2-forms

我的问题是如何在Angular中选择多个值。我试过的方法是:

模板:

<select multiple class="form-control" (click)="addDetails(t.value)" #t>
                    <option selected disabled>Select all applicable</option>
                    <option value="A">A</option>
                    <option value="C">C</option>
                    <option value="B">B</option>
                </select>

然后我在课堂上点击所有的价值观。然而,这对我来说并不是一个好方法。我想知道如何在这里利用Angular的数据映射。

组件:

 addDetails(value){
    this.selectedValues = this.selectedValues.concat(',');
  }

PS:我在使用之前删除了最后一个逗号。此外,我不想使用任何额外的插件,因为我没有奢侈的安装在这里:(。

请帮忙。

1 个答案:

答案 0 :(得分:0)

您可以使用具有md-select属性的angular-material2中的multiple,并通过ngModel轻松绑定。 Plunker demo

我还能够使用您的代码并将值绑定到ngModel。在以下demo中,您可以选择A,B,C(按住Shift键并单击可用选项),并查看所有这些选项已添加到selectedValue