Animation automatique de mat-tab avec material

Bonjour, voici l'exemple d'une animation avec mat tab en utilisant material:

https://material.angular.io/components/tabs/overview

Code:

1
2
3
4
5
6
 
<mat-tab-group>
  <mat-tab label="Tab 1">Content 1</mat-tab>
  <mat-tab label="Tab 2">Content 2</mat-tab>
  <mat-tab label="Tab 2">Content 3</mat-tab>
</mat-tab-group>

Je souhaite le rendre automatique sans avoir à cliquer manuellement, comment précéder ?

Est ce que je dois rechercher tout les boutons mat-tab et les boucler en simulant un click ?
Ou peut être déjà dans dans material pour réaliser cela ?

merci de vos réponses :)

j'ai pu trouvé :

Code:

1
2
3
4
5
6
7
 
<mat-tab-group [(selectedIndex)]="selectedIndex">
  <mat-tab label="Tab 1">Content 1</mat-tab>
  <mat-tab label="Tab 2">Content 2</mat-tab>
  <mat-tab label="Tab 3">Content 3</mat-tab>
  <mat-tab label="Tab 4">Content 4</mat-tab>
</mat-tab-group>

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
 
import { Component, OnInit } from '@angular/core';
 
@Component({
  selector: 'app-banniere',
  templateUrl: './banniere.component.html',
  styleUrls: ['./banniere.component.css']
})
export class BanniereComponent implements OnInit {
 
  selectedIndex = 0;
 
  constructor() { }
 
  ngOnInit() {
    setTimeout(() => {
      this.selectNextTab();
    }, 3000);
  }
  selectNextTab() {
    this.selectedIndex++;
  }
}