尝试在垫子芯片的点击事件上设置值时,出现了ExpressionChangedAfterItHaHasBeenCheckedError
我创建了一个堆栈闪电来查看操作中的错误(打开控制台,然后单击两个或更多芯片):https://stackblitz.com/edit/angular-ddapw1?file=app/chips-stacked-example.html
// index.html
<mat-chip-list>
<mat-chip
*ngFor="let chip of availableItems; index as idx"
[selected]="selectedItems.indexOf(idx) > -1"
(click)="select(idx)">
{{chip}}
</mat-chip>
</mat-chip-list>
// index.js
import {Component, ChangeDetectorRef} from '@angular/core';
@Component({
selector: 'chips-stacked-example',
templateUrl: 'chips-stacked-example.html',
styleUrls: ['chips-stacked-example.css'],
})
export class ChipsStackedExample {
constructor(private cdr: ChangeDetectorRef) {}
availableItems = ['foo', 'bar', 'baz'];
selectedItems = [];
select(idx) {
console.log('selecting', idx);
this.selectedItems.push(idx);
//this.cdr.detectChanges()
}
}
答案 0 :(得分:2)
您忘记添加multiple
属性:
<mat-chip-list multiple>