Guest User

Untitled

a guest
Jan 24th, 2019
97
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 0.93 KB | None | 0 0
  1. <mat-chip-list #chipList multiple="true">
  2. <mat-chip *ngFor="let fruit of fruits" [value]="fruit.name" [selected]="fruit.selected" (click)="onSelectFruit(fruit)">
  3. {{fruit.name}}
  4. </mat-chip>
  5. </mat-chip-list>
  6. <div class="hintLabel">Select Fruits</div>
  7. <br/>
  8. <button (click)="getSelectedChips()">Get Selected Chips</button>
  9. <br/><br/>
  10. <b>Selected Chips:</b>{{array | json}}<br/><br/>
  11. <b>Dynamic Selected Chips:</b>{{arrayDynamic | json}}
  12.  
  13. array: Fruit["name"][] = [];
  14. arrayDynamic: Fruit["name"][] = [];
  15.  
  16. ngOnInit(){
  17. for (let fruit of this.fruits) {
  18. if(fruit.selected){this.arrayDynamic.push(fruit.name);}
  19. }
  20. }
  21.  
  22. onSelectFruit(fruit){
  23. fruit.selected=!fruit.selected
  24. this.arrayDynamic = [];
  25. for (let fruit of this.fruits) {
  26. if(fruit.selected){this.arrayDynamic.push(fruit.name);}
  27. }
  28. }
  29.  
  30. getSelectedChips() {
  31. this.array = [];
  32. for (let fruit of this.fruits) {
  33. if(fruit.selected){this.array.push(fruit.name);}
  34. }
  35. }
Add Comment
Please, Sign In to add comment