таблица mat-chip не фильтруется при вводе имени на входе

Question

Я пытаюсь отфильтровать таблицу, используя несколько мат-фишек. Прямо сейчас, каждый раз, когда я вхожу в матовый чип, он фильтруется, но только в соответствии с последним введенным чипом.

Он также не удаляет чипы.

Почему это не так? за работой? Я делаю для l oop, чтобы проверить каждый элемент тегов массива и сделать его фильтрующим.

My html:

     ``` <mat-form-field>
          <mat-chip-list #tagList name="tags">
            <mat-chip *ngFor="let tag of tags" [removable]="true" (remove)="remove(tag)">
              {{tag}}
              <mat-icon matChipRemove>cancel</mat-icon>
            </mat-chip>
            <input [matChipInputFor]="tagList" [matChipInputAddOnBlur]="false"
              (matChipInputTokenEnd)="add($event)" />
          </mat-chip-list>
          <!-- <input matInput (keydown.enter)="applyFilter($event.target.value)" 
          placeholder="Filter..." value=""> 
        </mat-form-field>
        <table mat-table [dataSource]="dataSource" class="mat-elevation-z8" matSort>
          <ng-container matColumnDef="tags">
            <th mat-header-cell *matHeaderCellDef mat-sort-header> Tags </th>
            <td mat-cell *matCellDef="let element">
              <mat-chip-list name="tags">
                <mat-chip *ngFor="let tag of element.tags">
                  {{tag}}
                </mat-chip>
              </mat-chip-list>
            </td>
          </ng-container>

          <tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
          <tr mat-row *matRowDef="let element; columns: displayedColumns;" 
           (click)="goToDeviceDetails(element)">
          </tr>
        </table>```

my ts:

add(event: MatChipInputEvent): void {
  const input = event.input;
  const value = event.value;
//add tag
  if ((value || '').trim()) {
    this.tags.push(value);
    for (let i = 0; i < this.tags.length; i++) {
      this.dataSource.filter = this.tags[i]

    }
  }

  // Reset the input value
  if (input) {
    input.value = '';
  }
}

remove(tag: string): void {
  const index = this.tags.indexOf(tag);

  if (index >= 0) {
    this.tags.splice(index, 1);
  }
}

Заранее спасибо