title: Form validation is not working in angular?
body: <p>I want to check whether the dropdown is empty.</p>
  
  <p>Need to show the required message and </p>
  
  <p>If not empty, enable the submit button. </p>
  
  <p>If empty, disable the submit button. Below is my html</p>
  
  <p>Below is my html </p>
  
  <pre><code>&lt;form  [formGroup]="myForm"  (ngSubmit)="save()" &gt;
  &lt;mat-form-field&gt;
    &lt;mat-select formControlName="name" placeholder="Element List"  (selectionChange)="elementSelectionChange($event)" required&gt;
      &lt;mat-option *ngFor="let element of Elements" [value]="element.name"&gt;
        {{ element.name }}
      &lt;/mat-option&gt;
    &lt;/mat-select&gt;
    &lt;mat-error *ngIf="myForm.hasError('required', 'name')"&gt;Please choose an name&lt;/mat-error&gt;
  &lt;/mat-form-field&gt;
  &lt;mat-form-field&gt;
    &lt;mat-select  formControlName="symbol"  placeholder="Symbol List" required&gt;
      &lt;mat-option *ngFor="let element of selectedElementSymbol" [value]="element.symbol"&gt;
        {{ element.symbol }}
      &lt;/mat-option&gt;
    &lt;/mat-select&gt;
    &lt;mat-error *ngIf="myForm.hasError('required', 'symbol')"&gt;Please choose an symbol&lt;/mat-error&gt;
  &lt;/mat-form-field&gt;
  
  &lt;div mat-dialog-actions&gt;
  
    &lt;button mat-button (click)="onNoClick()"&gt;Cancel&lt;/button&gt;
  &lt;button type="submit"  mat-button cdkFocusInitial&gt;Add&lt;/button&gt;
  &lt;/div&gt;
  &lt;/form&gt;
  </code></pre>
  
  <p>below is my component </p>
  
  <pre><code>export class DialogOverviewExampleDialog {
  
    myForm: FormGroup;
    symbol = new FormControl('', Validators.required);
    name = new FormControl('', Validators.required);
    constructor(
      public dialogRef: MatDialogRef&lt;DialogOverviewExampleDialog&gt;,
      @Inject(MAT_DIALOG_DATA) public data: any,
      private formBuilder: FormBuilder) {
  
      this.myForm = this.formBuilder.group({
        name: [this.name],
        symbol: [this.symbol],
      });
    }
  
    save() {
  
      console.log(this.myForm.value);
    }
  
  }
  </code></pre>
  
  <p><a href="https://stackblitz.com/edit/angular-talrct-9bxei5?file=app%2Ftable-basic-example.html" rel="nofollow noreferrer">updated demo here</a> </p>