multiselection dropdown angular 4

Question

i wanna have dropdown list with the name of user, then i can check multi users and save the id of chosen users in array to loop them .. i used angular-2-dropdown-multiselect but i can't change the values in it [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>

i want to make myOptions equal response from API

i tried to make this response in the wany the package work:

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'}
            ]
    }

but it doesn't work ....

Answer 1

Since you want to use dropdown with checkboxes normal select does not come with checkboxes, you should go for some libraries such as primeng or angular material or make your own component.

With Angular Material. Just add multiple or [multiple]="true" to your mat-select.

DEMO