我正在通过此链接在我的Angular2项目中实现多选下拉菜单。但是现在我必须在这个多选下拉列表中显示分组,那么我该如何实现呢?或者是否有任何其他插件或类似的东西我可以关注。
组件 HTML:
<form [formGroup]="form" class="selector-form">
<div class="marTop20">
<ng-select [options]="options1"
[multiple]="multiple1"
placeholder="Select multiple"
formControlName="selectMultiple"
(opened)="onMultipleOpened()"
(closed)="onMultipleClosed()"
(selected)="onMultipleSelected($event)"
(deselected)="onMultipleDeselected($event)">
</ng-select>
</div>
</form>
ts文件中的组件代码:
export class FilterClientSelectorComponent implements OnInit {
form: FormGroup;
multiple1: boolean = true;
options1: Array<any> = [];
selection: Array<string>;
@ViewChild('preMultiple') preMultiple;
logMultipleString: string = '';
constructor() {
let numOptions = 100;
let opts = new Array(numOptions);
for (let i = 0; i < numOptions; i++) {
opts[i] = {
value: i.toString(),
label: i.toString(),
groupname:'a'
};
}
this.options1 = opts.slice(0);
}
ngOnInit() {
this.form = new FormGroup({});
this.form.addControl('selectMultiple', new FormControl(''));
}
private scrollToBottom(elem) {
elem.scrollTop = elem.scrollHeight;
}
}
我需要类似以下屏幕截图的输出:
输出页面: