title: Change tab by click on a button angular material 5
body: <p>I have a problem since Angular 5.X with a form-wizard (mat-tab-group). Everything woks fine by using clicks on tabs, it switchs between tabs but I can't use a "nextStep" or "previousStep" buttons to switch between tabs. Here my code :</p>
  
  <p>component.html</p>
  
  <pre><code>&lt;mat-tab-group [(selectedIndex)]="selectedIndex" (selectedTabChange)="tabChanged($event)" class="mat-tab-group mat-primary"&gt; 
  
  &lt;mat-tab label="Description"&gt;
   content...
  &lt;mat-card-content class="mat-card-content"&gt;
  &lt;/mat-card-content&gt;
   &lt;mat-card-footer style="margin:0 auto;"&gt;
           &lt;div fxLayout="row" fxLayoutAlign="end center"&gt;
              &lt;button mat-button type="button" (click)="cancel()" mat-raised-button color="warn"&gt;Cancel&lt;/button&gt;
              &lt;button color="primary" mat-raised-button (click)="nextStep()" type="button"&gt;Next&lt;/button&gt;                   
           &lt;/div&gt;
       &lt;/mat-card-footer&gt;
     &lt;/mat-tab&gt;
  &lt;/mat-tab-group&gt;
  </code></pre>
  
  <p>component.ts</p>
  
  <pre><code>    public tabChanged(tabChangeEvent: MatTabChangeEvent): void {
          this.selectedIndex = tabChangeEvent.index;
      }
  
      public nextStep() {
          this.selectedIndex += 1;
      }
  
      public previousStep() {
          this.selectedIndex -= 1;
      }
  </code></pre>
  
  <p>I'm stuck with [(selectedIndex)]="selectedIndex" because it doesn't work with mat-expansion-panel (<a href="https://stackoverflow.com/questions/48566845/mat-expansion-panel-is-opened-by-default-bug">Mat expansion panel is opened by default bug?</a>). So I have to remove it but, if i remove it my buttons "nextStep" and "previousNext" doesn't work anymore... </p>
  
  <p>I'm using : Angular material 5.1.1</p>
  
  <p>Any idea about this ?</p>
  
  <p>EDIT : As I said, the problem was about the selectedIndex... I used the selectedIndex in a condition to display the mat-expansion-panel. Bad idea... so solve the problem, I've created a boolean in my component to display or not the mat-expansion-panel. If i'm on the good tab, I set the boolean to true else, the boolean is false. Hope it's clear ^^</p>