问题描述：

在 Angular 中使用响应式表单时，当存在多个 drop-down 控件时，无法对它们进行独立选择。这是因为它们共享同一个 FormControl，而 FormControl 的值会被所有同样绑定它的控件所共享。

解决方案：

对于每个 drop-down 控件，需要单独创建一个 FormControl。

示例代码（html）：

  Select Option 1:
  
    {{option}}
  

  Select Option 2:
  
    {{option}}
  

示例代码（ts）：

import { Component, OnInit } from '@angular/core';
import { FormBuilder, FormGroup } from '@angular/forms';
import { Observable } from 'rxjs';

@Component({
  selector: 'app-drop-down',
  template: `
    

      Select Option 1:
      
        {{option}}
      

      Select Option 2:
      
        {{option}}
      
    
  `,
})
export class DropDownComponent implements OnInit {
  formGroup: FormGroup;
  options: Observable;

  constructor(private formBuilder: FormBuilder) {}

  ngOnInit() {
    this.options = this.getOptions();

    this.formGroup = this.formBuilder.group({
      option1: '',
      option2: '',
    });
  }

  getOptions(): Observable {
    return of(['Option 1', 'Option 2', 'Option 3']);
  }
}