How to make click mat-tab click?

I have a mat tabs:

 <mat-tab *ngFor="let template of templateTypes" (click)="toggleSelectedTab(template.type)"></mat-tab>

It does not emit click event. I have tried to use embadded span:

 <mat-tab *ngFor="let template of templateTypes" (click)="toggleSelectedTab(template.type)">
            <ng-template mat-tab-label>
                <span (click)="toggleSelectedTab(template.type)"> {{ template.name }} ({{ template?.count }})</span>
            </ng-template>
</mat-tab>

But span element has no fulll tab clickable area, it works as inline element.

It starts from index 0 to the number of tabs you create.

In your html

<mat-tab-group #tabGroup (selectedTabChange)="tabChanged($event)">
     <mat-tab *ngFor="let template of templateTypes" 
              (click)="toggleSelectedTab(template.type)"></mat-tab>
</mat-tab-group>

In component use this code

tabChanged = (tabChangeEvent: MatTabChangeEvent): void => {
    console.log('tabChangeEvent => ', tabChangeEvent); 
    console.log('index => ', tabChangeEvent.index); 
}