Как показать указанные c данные в MatTableDataSource?

Question

У меня есть приложение anuglar 8, и я использую материал.

, и у меня есть четыре категории. Но я только хочу показать данные для категории sepecifi c. В этом случае Intercviews

ТАК мой шаблон выглядит так:

<mat-tab-group
      (selectedTabChange)="onTabChange($event)"
      [selectedIndex]="selectedTab"
      (selectedIndexChange)="setTabState($event)"
    >
      <mat-tab [label]="tab.name" *ngFor= "let tab of tabs" >
        <div class="mat-elevation-z8 table-container">
          <table *ngIf = "tab.dataSource && tab.dataSource.data"  mat-table [dataSource]="tab.dataSource" matSort aria-label="Elements">

            <ng-container matColumnDef="title">
              <th mat-header-cell *matHeaderCellDef mat-sort-header i18n>Title</th>
              <td mat-cell *matCellDef="let row">{{ row?.title }}</td>
            </ng-container>



            <tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
            <tr mat-row [routerLink]="['..', row?.id]" *matRowDef="let row; columns: displayedColumns"></tr>
          </table>
        </div>

           <ng-template mat-tab-label #itemList let-itemType="itemType">
            <mat-icon class="interviews">speaker_notes</mat-icon>
            <span i18n>Interview reportssss</span>({{ countIntervieuws()}})
            <a [routerLink]="['../', dossier.id, 'item', 'new', itemTypes.Interview]"
              ><mat-icon class="add_box">add</mat-icon>
            </a>
          </ng-template>
      </mat-tab>


    </mat-tab-group>

И я вижу в этом свойстве:

countIntervieuws

Это два элемента типа интервью. Но это код ts:

ngOnInit(): void {

    this.activeTab = this.tabs[0];
    this.loadData().subscribe(data => {

      const resultInterview = this.dossierItems.filter(i => i.itemType === this.itemTypes.Interview ).length;

      this.activeTab.dataSource = new MatTableDataSource(data);     
    });

    const state = this.uiStateService.getState();
    if (state) {
      this.selectedTab = state.tabState || 0; // If there is no state
    }
    this.setTabState(state.tabState);
  }

  dossierItemsCountBy(itemType: DossierItemTypeDto) {
    return this.typeSearchMatches[itemType.toString()] || { total: 0, matches: 0 };
  }

и dto:

export type DossierItemTypeDto = 'Interview' | 'Note' | 'Goal' | 'ActionStep';

export const DossierItemTypeDto = {
  Interview: 'Interview' as DossierItemTypeDto,
  Note: 'Note' as DossierItemTypeDto,
  Goal: 'Goal' as DossierItemTypeDto,
  ActionStep: 'ActionStep' as DossierItemTypeDto
};

Но теперь в ngOninit () все элементы загружены. и не только элементы с типом inteview.

, потому что эта строка:

  this.activeTab.dataSource = new MatTableDataSource(data);    

, конечно, вернет все элементы. Но я хочу вернуть только предметы с типом = интервью

Так как теперь загружать только предметы с типом интервью?

Спасибо