title: dynamic disable/enable in mat-select does not work properly
body: <p>I am creating a reactive form with mat-select within. </p>
  
  <pre><code>&lt;mat-form-field&gt;
      &lt;mat-select placeholder="Salutation*" formControlName="salutation"&gt;
        &lt;mat-option *ngFor="let salutation of salutations" [value]="salutation.id"&gt;
          {{ salutation.label }}
        &lt;/mat-option&gt;
      &lt;/mat-select&gt;
  &lt;/mat-form-field&gt;
  </code></pre>
  
  <p>Form:</p>
  
  <pre><code>this.form = this.fb.group({
    person: this.fb.group({
      salutation: ['', Validators.required],
      firstName: ['', Validators.required],
      lastName: ['', Validators.required],
      email: ['', Validators.required]
    })     
  });
  </code></pre>
  
  <p>I need to disable/enable this select depending on other inputs value.
  Since [disabled] is no longer supported by reactive forms I used the following</p>
  
  <pre><code>this.form.get('person').get('salutation').disable();
  </code></pre>
  
  <p>the issue is when I try to enable the select back using </p>
  
  <pre><code>this.form.get('person').get('salutation').enable();
  </code></pre>
  
  <p>It just does not work. Any ideas why? </p>
  
  <p>PS: using the disabled property works fine but it throws a warning</p>
  
  <blockquote>
    <p>It looks like you're using the disabled attribute with a reactive form directive. If you set disabled to true
          when you set up this control in your component class, the disabled attribute will actually be set in the DOM for
          you. We recommend using this approach to avoid 'changed after checked' errors.</p>
  </blockquote>
  
  <pre><code>  Example: 
    form = new FormGroup({
      first: new FormControl({value: 'Nancy', disabled: true}, Validators.required),
      last: new FormControl('Drew', Validators.required)
    });
  </code></pre>
  
  <p>Thanks!</p>