title: Angular File Upload custom mat error issue
body: <p>I have a form for uploading a file in an angular 5 app.For which i want to display custom error if the format of the file does not match with the following :</p>
  
  <p><strong>And the user should see the error message, "Only PDF, Excel, Powerpoint, or Audio (wav and wmv) files are accepted."</strong></p>
  
  <p>Here is my HTML code:</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;div class="detail-item"&gt;
                                          &lt;span class="upload-btn-wrapper"&gt;
                                              &lt;input #file type="file" class="inputfile" name="input-file-preview" (change)="OnchangeFile($event)" /&gt;
                                              &lt;span class="fs-btn fs-btn-standard file-selection" (click)="file.click()"&gt;{{'DTM.BulletinPublication.browse' | translate}}&lt;/span&gt;
                                          &lt;/span&gt;
                                          &lt;span class="file-name"&gt;
                                              &lt;mat-form-field&gt;
                                                  &lt;input id="fileName" matInput placeholder="File Name" formControlName="fileName" readonly="readonly"&gt;
                                                  &lt;mat-error&gt;{{getErrorMessageForFileFormat()}}&lt;/mat-error&gt;
                                              &lt;/mat-form-field&gt;
                                          &lt;/span&gt;
                                      &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>Here is the "onFileChange" method used in the fileUpload control:</p>
  
  <pre><code> OnchangeFile(evt: any): void {
          let files: File[] = evt.target.files;
          let file: File = files[0];
          if (files &amp;&amp; file) {
              let isValidFileFormat = this.checkForFileExtention(file);
  
              this.filename = file.name;
              let reader: FileReader = new FileReader();
              reader.onload = this._handleReaderLoaded.bind(this);
              reader.readAsArrayBuffer(file);
              this.publishBulletinForm.get(BulletinFields.fileName).setValue(file.name);
              this.publishBulletinForm.get(BulletinFields.fileName).updateValueAndValidity();
              if (this.isEdit) {
                  this.bulletinFileNameChange();
              }
  
  
              if (!isValidFileFormat)
              {
                 *this.publishBulletinForm.get(BulletinFields.fileName).setErrors({ 'incorrect': true });*
  
              }
          }
      }
  </code></pre>
  
  <p>and here is the code for the custom validator I have written and used:-</p>
  
  <pre><code>getErrorMessageForFileFormat(): string {
          let me: BulletinsPublishComponent = this;
          let errMsg: string = '';
          if (me.publishBulletinForm.get(BulletinFields.fileName).hasError('required')) {
              errMsg = me.getTranslation('DTM.BulletinPublication.FileTypeRequired');
              this.isFormValid = false;
          }
          else if (me.publishBulletinForm.get(BulletinFields.fileName).hasError('incorrect')) {
              errMsg = me.getTranslation('DTM.BulletinPublication.InvalidFileType');
              this.isFormValid = false;
          }
  
          me.cd.markForCheck();
          return errMsg;
      }
  </code></pre>
  
  <p>No matter what i do it never display the error message.Can some one please help me out with this?</p>