Angular 基于实例变量将对象分隔为mat选项卡

角度5 我在

mat选项卡组中有两个选项卡

，每个选项卡包含一个

mat表

。有一个对象数组被提取到一个

数据源中，该数据源用于填充这些
mat表。每个对象都有一个变量，比如x，它可以取一个等于1或2的值。如果某个对象的x=1，它应该进入第一个选项卡，否则进入第二个选项卡。我怎么做呢？当前结构：

<mat-tab-group>
        <mat-tab label="tab1">
          <div>
            <mat-table #table [dataSource]="dataSource" matSort>
            ...
            </mat-table>
          </div>
        </mat-tab>
        <mat-tab label="tab2">
          <div>
            <mat-table #table [dataSource]="dataSource" matSort>
            ...
            </mat-table>
          </div>
        </mat-tab>
<mat-tab-group>


...
...

注意：我想这可以使用内联模板变量来实现，但不知道如何实现。开放接受更好的解决方案，如果有的话。
在您的情况下，您将无法为所有选项卡提供一个数据源，您需要为每个选项卡提供唯一的数据源

像解决方案一样，我将首先准备所有数据，通过“x”参数将其分组

在下一步中，将所有分组数据转换为MatTableDataSource对象

最后一步是使用*ngFor仅渲染每个组的所有“mat选项卡”。
您可以尝试此功能，谢谢！我尝试了这个，但是我所有的标签都被相同的数据填充。没有发生分离。您可以提供一些数据示例吗？我有一个类“Event”，它有一个实例变量“time”。假设ev是一个事件对象，我尝试在数据源中填充一个事件对象数组。这不起作用，那就是你要找的？