Angular 6 Reactive Forms - 按条件动态设置 select FormControl 的选定 option

html
<select [formControl]="myControl">
  <option *ngFor="let option of options" [value]="option">{{ option }}</option>
</select>

typescript
import { Component, OnInit } from '@angular/core';
import { FormControl } from '@angular/forms';
@Component({
  selector: 'app-my-form',
  template: <code>
    <select [formControl]="myControl">
      <option *ngFor="let option of options" [value]="option">{{ option }}</option>
    </select>
  </code>,
  styleUrls: ['./my-form.component.CSS']
})
export class MyFormComponent implements OnInit {
  myControl: FormControl;
  options: string[] = ['Option 1', 'Option 2', 'Option 3'];
  constructor() {
    this.myControl = new FormControl();
    this.myControl.valueChanges.subscribe(value => {
      this.updateOptions(value);
    });
  }
  ngOnInit() {}
  updateOptions(value: string) {
    // 根据条件更新选定<option>的值
    if (value === 'Option 1') {
      this.options = ['Option 1', 'Option 2'];
    } else if (value === 'Option 2') {
      this.options = ['Option 2', 'Option 3'];
    } else {
      this.options = ['Option 3'];
    }
  }
}