首页 > 解决方案 > 为什么选项选择反应形式角度不起作用?

问题描述

我正在使用 Angular 5 构建反应式表单,我正在尝试使用列表中的选项添加选择,但该列表不存在于 html 页面中。我看到了一些类似的问题并尝试了建议的答案,但没有成功,我做错了什么?

ts:

firstQuestionnaire: FormGroup;
yearsCurrentHome: string [] = ['1','2','3','4','5+'];
default: string = '1';

 constructor(private formBuilder: FormBuilder) { 
    this.firstQuestionnaire=this.createFormGroup();
    this.firstQuestionnaire.controls['yearsInCurrentHome'].setValue(this.default, {onlySelf: true});
  }
createFormGroup() {
    return new FormGroup({
      yearsInCurrentHome: new FormControl(null)
 });
  }

HTML:

<div class="question">
      <label>YEARS: </label>
      <select formControlName="yearsInCurrentHome">
        <option *ngFor="let year of yearsCurrentHome" [ngValue]="year"> {{year}}
        </option>
      </select>
    </div>

谢谢

标签: angulartypescriptangular-reactive-forms

解决方案


您需要在 html 中包含 form 标记,如下所示:

 <form [formGroup]="firstQuestionnaire">
        <select formControlName="yearsInCurrentHome">
            <option *ngFor="let year of yearsCurrentHome" [ngValue]="year"> {{year}}
            </option>
          </select>
    </form>

推荐阅读