角材料选项卡 cdkchange 未定义索引

Question

问题是当我想更改选项卡时，它会显示一条错误消息： comment

我的代码如下：

 <mat-tab-group mat-align-tabs="start">
      <mat-tab label="tab1">
        <ng-template matTabContent>
          <app-list-table [logic]="this.logic" [groupable]="false"></app-list-table>
        </ng-template>
      </mat-tab>
      <mat-tab label="tab2">
        <ng-template matTabContent>
          <app-list-table [logic]="this.logic" [groupable]="true"></app-list-table>
        </ng-template>
      </mat-tab>
      <mat-tab label="tab3">
        <ng-template matTabContent>
          <app-group-table [logic]="this.logic"></app-group-table>
        </ng-template>
      </mat-tab>
    </mat-tab-group>

在选项卡上更改 app-list-table component.ts 代码：

export class ListTableComponent extends DestroyableBase implements OnInit, AfterViewInit {
 
  displayedColumns: string[] = [
    'open',
    'id',
    'dtCreated',
    'nmUser',
  ];
  dataSource = new MatTableDataSource<any>();
  

  @ViewChild(MatPaginator, { static: true }) paginator: MatPaginator;
  @ViewChild(MatSort, { static: true }) sort: MatSort;

  @Input() logic: ListService;
  @Input() groupable: boolean;

  constructor(private router: Router) {
    super();
  }

  ngAfterViewInit() {
    this.dataSource.sort = this.sort;
    this.dataSource.paginator = this.paginator;
   }
    
  ngOnInit() {
    this.logic.List$.pipe(takeUntil(this.destroy$)).subscribe((list) => { 
      this.dataSource.data = list;
    });
  }
}

逻辑获取数据源 onInit 的数据，所以当我切换选项卡时它会被加载。但我不确定，这会导致问题。