相关疑难解决方法(0)

我有一个模型驱动的表单,我想添加一个包含几个选项的下拉列表.选项来自预先获取的列表,并且表单的模型被注入到组件中.表单已正确加载:模型中的所有字段都已正确填充,abd下拉列表的选项列表也正确加载.
唯一的问题是我无法设置selected列表的值,并且它首先显示为空值.

在这里,我正在加载HMOs列表,然后加载患者,然后才创建表单.
表格的所有值(名称,id等在此省略)都正确加载到表单中.
表单中的下拉列表已正确填充:所有HMO都填充列表.
但是,缺少列表中的选定值,并且加载的丢失没有初始值.
出于调试目的,我已经将option标签中的布尔条件替换patient.hmo.uid == hmo.uid为函数调用:isSelected(hmo).
此函数基本上执行相同的比较并返回其值,但首先记录它.实际上,我看到具有正确hmo的true选项获取false值,所有其他选项获取值,这意味着所有数据都正确加载.

此外,当我设置[selected]="true"(总是为真)时,我确实看到更改有效:选择了最后一个选项(HTML中的默认选项).

那我在哪里错了？我该如何正确设置所选选项？

组件的代码(除了HMO之外的所有字段都被省略):

import {Component, Input, Inject, OnInit} from "@angular/core";
import {
  FormGroup,
  FormControl,
  REACTIVE_FORM_DIRECTIVES,
  Validators,
  FormBuilder,
  FormArray
} from "@angular/forms";
import {Patient} from "./patient";
import {PatientsService} from "./patients.service";
import {Hmo} from "../hmos/hmo";
import {HmosService} from "../hmos/hmos.service";
import {Doctor} from "../doctors/doctor";
import {DoctorsService} from "../doctors/doctors.service";
import {Router, ActivatedRoute} from "@angular/router";
import {Subscription} from "rxjs/Rx";
import {Response} …

我做了一些研究,我很惊讶地发现它并不像应该的那样直截了当.

我知道有一些使用ngModel的方法.就像在typecript和Angular2等中绑定和获取下拉列表值一样.但我希望能够轻松地将我选择的选项绑定到我的formControlName var.

这是我尝试过的:

.HTML

 <form id="myForm" name="father" [formGroup]="fatherForm" (ngSubmit)="createFather()">
     <div class="row">
         <select formControlName="pref" id="f">
              <option value=null disabled selected>Prefijo</option>
              <option *ngFor="let item of prefs" [ngValue]="hola">{{item.name}}</option>
          </select>

      </div>
 </form>

.TS

fatherForm: FormGroup;  

this.fatherForm = this.formBuilder.group({
          pref: ['AA']
});

 this.prefs=[
     {name: "AA"},
     {name: "BB"}
  ];

默认值有效.但是当我选择BB时,仍然会选择默认值.当默认值为''时会发生同样的情况

这种方法由Harry-ninh在FormBuilder Angular 2的Bind Select List中提出

我究竟做错了什么？

注意:当然,表单中还有其他输入,为简单起见,忽略它们.

编辑

我尝试在这个plunkr中使用完全相同的例子,它也不起作用. http://plnkr.co/edit/Rf9QSSEuCepsqpFc3isB?p=preview 发送表单后,表明尚未触及该值.