0

Hi i have used Angular8 and bootstrap 4. I have used bootstrap multi-select dropdown, i need to get the selected dropdown values. How can i get those values.

DEMO

TS:

 setTimeout(() => {
      $('#multiselectFileName').multiselect({
        buttonWidth: '400px'
      });
      $('#multiselectUser').multiselect({
        buttonWidth: '400px'
      });
    },100)

HTML:

<div class="form-group">
          <label for="">Select User</label>
          <select name="user" id="multiselectUser" multiple="multiple" (change)="selecteduser($event)">
              <option *ngFor="let field of user" [value]="field.id" >
                  {{field.userName}}</option>
          </select>
      </div>
Bhrungarajni
  • 2,415
  • 11
  • 44
  • 88

1 Answers1

1

For me, it's simular to this question, try to use [(ngModel)] to bind a variable of your component (ts file) in your select tag to see what happens, and also use console.log() or debug mode to view the value of the variable binding to [(ngModel)] For example:

<select [(ngModel)]="selectedUsers" name="user" id="multiselectUser" multiple="multiple" (change)="selecteduser($event)">
              <option *ngFor="let field of user" [value]="field.id" >
                  {{field.userName}}</option>
          </select>
  • Try to use *ng-container* for your *ngFor inside a select tag ` `
    I succeeded in your Demo by the code above, you can learn this from [Doc Official](https://angular.io/guide/structural-directives#ng-container-to-the-rescue)
    – Etienne-qwer Jun 18 '20 at 17:29