多选下拉列表 angular 4

Question

我想要一个带有用户名的下拉列表，然后我可以检查多个用户并将所选用户的 ID 保存在数组中以循环他们..我使用 angular-2-dropdown-multiselect 但是我无法更改其中的值 [https://www.npmjs.com/package/angular-2-multiple-selection]

<select  class="custom-select" [(ngModel)]="username" formControlName="username" multipe >
     <option *ngFor="let user of users" [value]="user.user_ID"> {{ user.user_Name }} </option>
</select>

我想让 myOptions 与 API

的响应相同

我试图在任何包工作的情况下做出这个回应：

this.dataStorageService.getUsers().subscribe(response => {
      this.users= response.json() ;
    });
    for(let i = 0 ; i < this.users.length; i++){
        this.test= this.users[i].user_Name;
        this.testId = this.users[i].user_ID;
        this.myOptions=[
            { id : this.testId , name: 'this.test'}
            ]
    }

但是没用....

Answer 1

既然你想使用带复选框的下拉菜单，正常的 select 不带复选框，你应该去一些库，如 primeng 或 angular material 或者制作你自己的组件。

与Angular Material。只需将多个或 [multiple]="true" 添加到您的 mat-select.

DEMO

多选下拉列表 angular 4

multiselection dropdown angular 4

api

multi-select

typescript

angular