title: Override the default icon from mat-stepper angular material
body: <p>I'm trying to override the default edit icon from stepper material angular but this don't work.</p>
  
  <p>I try:</p>
  
  <pre><code>&lt;mat-horizontal-stepper [linear]="isLinear" #stepper&gt;
     &lt;mat-step&gt;
        &lt;form&gt;
             &lt;ng-template matStepperIcon="edit"&gt;
                  &lt;mat-icon&gt;home&lt;/mat-icon&gt;
             &lt;/ng-template&gt;
  
      ...
  
  &lt;/mat-horizontal-stepper&gt;
  </code></pre>
  
  <p>In this way my result is:</p>
  
  <p>When the stepper is active/inactive:</p>
  
  <p><a href="https://i.stack.imgur.com/upB0e.png" rel="noreferrer">https://i.stack.imgur.com/upB0e.png</a><br>
  <a href="https://i.stack.imgur.com/tU143.png" rel="noreferrer">https://i.stack.imgur.com/tU143.png</a></p>
  
  <p>There's something special that i have to do?</p>
  
  <p>Stackblitz:
  Click in material page. the home icon is not inside the blue circle.</p>
  
  <p><a href="https://stackblitz.com/edit/angular-material-design-wxawqh" rel="noreferrer">https://stackblitz.com/edit/angular-material-design-wxawqh</a></p>