title: disable mat-step in mat-vertical-stepper
body: <p>I have 4 <code>mat-step</code> in <code>mat-vertical-stepper.</code> I want to disable 2nd,3rd &amp; 4th <code>mat-step</code> until the 1st <code>mat-step</code>'s all fields covered.</p>
  
  <p>I tried:</p>
  
  <pre><code>&lt;mat-step label="Step 1"&gt;
      &lt;!-- some codes--&gt;
  &lt;/mat-step&gt;
  </code></pre>
  
  <p>In Step 1 I have a next button and this button is disabled till all fields are covered. </p>
  
  <pre><code>&lt;button mat-raised-button color="primary" style="float:right"
       [disabled]="!DetailsForm.valid" (click)="step2.disabled = false"&gt;Next&lt;/button&gt; 
  </code></pre>
  
  <p>Next is STEP 2:</p>
  
  <pre><code>&lt;mat-step label="Step 2" [disabled]="step2.disabled"&gt;
  </code></pre>
  
  <p>it shows an error "disabled is not a part of <code>mat-step</code>". </p>
  
  <p>Like this, rest two <code>mat-step</code> are there. I want to disable 2nd,3rd,4th <code>mat-step</code>. </p>
  
  <p>In below case, how can I use <code>linear</code>?</p>
  
  <pre><code>    &lt;mat-vertical-stepper #stepper&gt;
         &lt;mat-step label="General Details"&gt;
             &lt;h4&gt; First Name &lt;/h4&gt;
         &lt;/mat-step&gt;
         &lt;mat-step label="Education"&gt;
             &lt;h4&gt;Highest Education &lt;/h4&gt;
         &lt;/mat-step&gt;
      &lt;/mat-vertical-stepper&gt;
  </code></pre>
  
  <p>And,</p>
  
  <pre><code>   &lt;div class="col-md-9 col-lg-9"&gt;
       &lt;form [formGroup]="generalDetailsForm"&gt;
         &lt;div class="row"&gt;
           &lt;div class="col-md-5 col-lg-5"&gt;
             &lt;mat-form-field class="example-full-width"&gt;
               &lt;input matInput placeholder="First Name" [(ngModel)]="firstName"&gt;
             &lt;/mat-form-field&gt;
           &lt;/div&gt;
        &lt;/div&gt;
      &lt;/form&gt;
     &lt;/div&gt;
  </code></pre>