这对我有用:
<ng-select #my-select [multiple]="true" [items]="dataList"></ng-select>
导入以下类:
import { ViewChild } from '@angular/core';
import { SelectComponent, SelectItem } from 'ng2-select';
在组件类中,使用装饰器访问my-select
组件:@ViewChild
@ViewChild('my-select') mySelectComponent: SelectComponent;
深入研究 ng2-select 源代码提示该active
属性SelectComponent
保存了选定的值。此外,active
是一个SelectItem
对象数组。因此,创建SelectItem
对象并将它们推入active
数组应该允许您以编程方式添加/删除选定的项目。
来到你的问题,让我们设置几个默认值ng2-select
:
ngOnInit() {
if(!this.mySelectComponent.active) {
this.mySelectComponent.active = new Array<SelectItem>();
}
this.mySelectComponent.active.push(new SelectItem("Apple"));
this.mySelectComponent.active.push(new SelectItem("Banana"));
}
您还可以清除所有现有值:
reset() {
if(this.mySelectComponent.active) {
this.mySelectComponent.active.length = 0;
}
}
注意:SelectItem
构造函数将字符串或对象作为参数。如果你传入一个字符串,id
andtext
将被设置为字符串值。如果你想为id
and传递不同的值text
,你可以这样做:
this.mySelectComponent.active.push(new SelectItem({id:'apl', text:'Apple'}));