내가 찾는 흥미로운 문제할 수 없는 바이패스입니다.
나는 다음*ngFor 루프 이벤트를 클릭합니다.
<label class="input-group" *ngFor="let status of statuses; trackBy: id"
(click)="filterByCategory(status.name)">{{ status.name }}
<span class="chip chip-icon" [attr.data-chip-state]="status.name">
{{ partners | counter: status.name }}</span>
<input type="checkbox" />
<span class="checkmark"></span>
</label>
릭 이벤트 fn filterByCategory()간단한 프로세스에 대한 책임,추가 또는 제거에서 문자열하여 배열한 다음 필터의 배열 개체입니다.
filterByCategory(category, event: Event) {
let verify = this.filterArr.includes(category);
if (!verify) {
this.filterArr.push(category)
} else {
let indexOfCategory = this.filterArr.indexOf(category);
this.filterArr.splice(indexOfCategory, 1);
}
this.filteredPartners = this.partners.filter(partner => {
return this.filterArr.includes(partner.partner_status.name);
})
}
이벤트가 발생할 때,그것은 두 번 실행되며 이 경우 문을 먼저 추가 문자열은 다음 제거합니다.
하나는 방법을 해야 합니까?
감사합니다!