title: Why mat-error not get displayed inside mat-form field in angular material 6 withcustom global validators
body: <p>i am using angular material 6 ,i have a vaidation inside mat-form-field mat-error is not displayed , when move after mat-form-field to the mat-error which is displaying properly.</p>
  
  <p>Not Working code:</p>
  
  <pre><code> &lt;mat-form-field&gt;
  &lt;input matInput type="time" formControlName="ToTime"/&gt; &lt;mat-error *ngIf="DaterForm.get('ToTime').hasError('InValidToTime')"&gt;FromTime Should be less than ToTime if choose a same date&lt;/mat-error&gt;
       &lt;/mat-form-field&gt;
  </code></pre>
  
  <p>Working Fine:</p>
  
  <p></p>
  
  <pre><code> &lt;input matInput type="time" formControlName="ToTime"/&gt; &lt;/mat-form-field&gt;
   &lt;mat-error *ngIf="DaterForm.get('ToTime').hasError('InValidToTime')"&gt;FromTime Should be less than ToTime if choose a same date&lt;/mat-error&gt;
  </code></pre>
  
  <p>Some one explain why which is not working inside that control.</p>
  
  <p>Live Demo:
  <a href="https://stackblitz.com/edit/angular-customvalidator-dhcmd4?file=app/datepicker-overview-example.html" rel="noreferrer">stackblitz</a></p>