angular material tabs with next button
// in HTML (¬‿¬)
<mat-tab-group [selectedIndex]="btnNextPrev.index">
....
</mat-tab-group>
<button mat-raised-button [disabled]="btnNextPrev.prev" (click)="navig('prev')">Prev</button>
<button mat-raised-button [disabled]="btnNextPrev.next" (click)="navig('next')">Next</button>
// in TYPESCRIPT ༼ つ ◕_◕ ༽つ
btnNextPrev = {
prev: true,
next: false,
index: 0
}
navig(n) {
switch (n) {
case 'next': {
this.btnNextPrev.index++
if (this.btnNextPrev.index > 3) {
this.btnNextPrev.prev = false
this.btnNextPrev.next = true
} else {
this.btnNextPrev.prev = false
}
}; break;
case 'prev': {
this.btnNextPrev.index--
if (this.btnNextPrev.index == 0) {
this.btnNextPrev.prev = true
this.btnNextPrev.next = false
} else {
this.btnNextPrev.next = false
}
}; break;
}
}