I dynamically loop thru tabs and i would like to add a (click) event on to be able to load different options when i select tab.
Isn't it possible to have an event (click) event on ? I tried with (selectChange) on but then i cannot get hold of bank.id from my loop when creating tabs.
Isn't it possible to add simple click event on dynamically created tabs??
<mat-tab-group>
<mat-tab label="All transactions">
<mat-list>
<mat-list-item *ngFor="let bank of banks">
<h4 mat-line>{{bank.fullName}}</h4>
</mat-list-item>
</mat-list>
</mat-tab>
<mat-tab *ngFor="let bank of banks" (click)="fetchAccounts(bank.id)" label="{{bank.fullName}}">
<mat-list>
<mat-list-item *ngFor="let account of accounts">
<h4 mat-line>{{bank2.fullName}}</h4>
</mat-list-item>
</mat-list>
</mat-tab>
<!-- <mat-tab label="Test Bank" disabled>
No content
</mat-tab> -->
</mat-tab-group>
Isn't it possible to add simple click event on dynamically created tabs?
- no i think, it isn't possible, but you can use (selectedTabChange) on <mat-tab-group>
as:
<mat-tab-group (selectedTabChange)="yourFn($event)">
The event-Object holds an index, so you can do something like this:
yourFn($event){
this.fetchAccounts(this.banks[$event.index].id)
}