javascript - 用数组填充下拉框时遇到问题

Question

我有以下数组:

testArray=[1,2,3,4]

以及以下 HTML 代码:

      <div >
        <select>
        <option *ngFor="let obj of testArray"
               name="mission"
               formControlName="mission"
               (click)="onMissionClick(mission)"
                [value]="obj"
               >
          {{obj}}

        </option>
        </select>
    </div>

输出是一个下拉列表，仅包含 testArray 的第一个拖曳值: 1 、 2 。然后我收到以下错误:

BasicInfoDPComponent.html:39 ERROR Error: No value accessor for form control with name: 'mission'
    at _throwError (forms.js:1591)
    at setUpControl (forms.js:1501)
    at FormGroupDirective.push../node_modules/@angular/forms/fesm5/forms.js.FormGroupDirective.addControl (forms.js:4037)
    at FormControlName.push../node_modules/@angular/forms/fesm5/forms.js.FormControlName._setUpControl (forms.js:4542)
    at FormControlName.push../node_modules/@angular/forms/fesm5/forms.js.FormControlName.ngOnChanges (forms.js:4492)
    at checkAndUpdateDirectiveInline (core.js:8941)
    at checkAndUpdateNodeInline (core.js:10209)
    at checkAndUpdateNode (core.js:10171)
    at debugCheckAndUpdateNode (core.js:10804)
    at debugCheckDirectivesFn (core.js:10764)

注意:正如您可能注意到的那样，我需要将下拉列表放入表单中，不符合表单效果很好。

Answer 1

将name和formControlName移动到select元素。这是实际的输入:

<select  name="mission"
         formControlName="mission">
    ...
</select>