使用angular2反应形式动态设置selectbox值

Question

我正在使用angular2反应形式来构建表单。但是我如何动态设置selectbox值。（我希望'VPA'应该动态预选）

<form [formGroup]="addBeneficiaryForm">
    <ion-item>
                <ion-label stacked>Type</ion-label>                    
                <ion-select [formControl]="type">
                  <ion-option value="VPA">VPA</ion-option>
                  <ion-option value="MMID">MMID/MOBILE</ion-option>                 
                </ion-select>
              </ion-item>
       </form>

我尝试按以下方式设置，但无法正常工作。

@Component({
  selector: 'addbenificiary',
  templateUrl: 'addbenificiary.html' 
})
export class AddBeneficiaryPage {
  addBeneficiaryForm: FormGroup;
  type: AbstractControl;
  constructor(private fb: FormBuilder){
    this.addBeneficiaryForm = fb.group({     
       'type': ['', Validators.compose([Validators.required])]         
    }); 
  }
 public ionViewDidLoad() {
    this.addBeneficiaryForm.controls['type'].setValue('VPA');
 }
}

Answer 1

尝试使用formControlName代替[formControl]：

<ion-select formControlName="type">