我有以下html代码
<mat-tab label="Regular" (selectChange)="tabClick()"
(click)="tabClick()">
<h1>Some more tab content</h1>
</mat-tab>
这就是功能,
tabClick(){
console.log('Tab clicked...');
}
但它似乎没有被调用,为什么?没有任何一个以上事件被触发?
我有以下html代码
<mat-tab label="Regular" (selectChange)="tabClick()"
(click)="tabClick()">
<h1>Some more tab content</h1>
</mat-tab>
这就是功能,
tabClick(){
console.log('Tab clicked...');
}
但它似乎没有被调用,为什么?没有任何一个以上事件被触发?
事件selectedTabChanged
必须附加到<mat-tab-group>
元素
<mat-tab-group (selectedTabChange)="tabClick($event)">
<mat-tab label="Tab 1">Content 1</mat-tab>
<mat-tab label="Tab 2">Content 2</mat-tab>
</mat-tab-group>
tabClick(tab) {
console.log(tab);
}
一个事件应该selectedTabChange
是mat-tab-group
<mat-tab-group (selectedTabChange)="tabClick()">
<mat-tab label="Regular">
<h1>Some more tab content</h1>
</mat-tab>
</mat-tab-group>
<mat-tab-group (selectedTabChange)="onChange($event)">
<mat-tab label="Tab 1">Content 1</mat-tab>
<mat-tab label="Tab 2">Content 2</mat-tab>
</mat-tab-group>
选定的选项卡将触发 tabChange 事件并获取活动选项卡。
在.ts
文件中:
onChange(event: MatTabChangeEvent) {
const tab = event.tab.textLabel;
console.log(tab);
if(tab===" Tab 1")
{
console.log("function want to implement");
}
}