我有三个组成部分一个是主要的一个和其他两个是选项卡，问题是matsort是不工作，这里是我的代码。我尝试了几个小时搜索几个来源，但无法使它，任何帮助将不胜感激。
- 批准-主页.组件. ts**
@Component({
selector: 'app-approve-home',
templateUrl: './approve-home.component.html',
styleUrls: ['./approve-home.component.css']
})
export class ApproveHomeComponent implements OnInit {
@ViewChild('tabGroup', {static: false}) tabGroup: MatTabGroup;
constructor() {
}
ngOnInit() {
}
onMoveTab(event: { tabIndex: number }) {
this.tabGroup.selectedIndex = event.tabIndex;
}
}- 批准主页.组件. html**
x一个一个一个一个x一个一个二个一个x一个一个三个一个
approve-group.component.html
<table mat-table [dataSource]="dataSource" class="mat-elevation-z8" matSort>
<!-- Application No Column -->
<ng-container matColumnDef="applicationNo">
<th mat-header-cell *matHeaderCellDef mat-sort-header> Application No </th>
<td mat-cell *matCellDef="let element"> {{element?.applicationNo}} </td>
</ng-container>- 注意：导入均已正确实施**
我想让这个排序函数工作，我已经检查了当我点击matSortHeader，ngAfterViewOnInit没有被调用。相反，它调用在我第一次启动这个组件，这意味着甚至在点击按钮之前，在他的第一个标签。
2条答案
按热度按时间jv4diomz1#
材质选项卡设置可见性：隐藏选项卡上的隐藏CSS属性。
所以从技术上讲，所有组件都加载到DOM中，这就是为什么ngAfterViewInit生命周期为所有组件启动的原因，包括app-approve-group。
解决这个问题的一种方法是当tabIndex是app-approve-group的tabIndex时，在父组件中进行排序，并将排序后的数据通过输入绑定变量传递到子组件（pp-approve-group）中。注意，您必须展开对象，以便angular的ngOnChanges能够拾取它。
或
将索引作为输入绑定变量发送，如果当前选项卡是子组件的选项卡索引，则签入该变量的ngOnChanges。
基本上，您将必须包含选项卡更改的子组件，然后基于该触发器执行所需的操作。
希望这个有用。
f2uvfpb92#
而不是仅仅把这个：
将其改为：
}