Javascript Angular2被动表单：验证*ngIf中的字段

我有一个带有

md select

和

md单选按钮

字段的表单。单选按钮下的选项将根据md select中选择的选项显示。请访问

您可以看到，我已经创建了表单，其中sub-organism单选按钮字段是必需的。它在第一次加载时工作。但是，如果我们选择任何子单选按钮选项，然后更改有机体选择框，则表单仍然有效，没有有效的子有机体值。如果未选中sub单选按钮，我需要表单无效。请帮忙

---

问题2：同样在plunk中，请取消对app.component.ts中第47行之后的以下行的注释，以便字段有一个默认值。将显示sub有机体单选按钮，但选择框将为空。有一个选定的值，这就是显示sub-Organic字段的原因。不确定为什么未为organism md select选择该选项。

向

md select

添加

change

事件，以便在选择更改且表单已验证时，可以将

selected.sub_organism_id

的值重置为

null

。这将使表单无效

代码片段：

html:

更新：

---

正如@WillHowell在他的评论中所说，“md select通过对象引用而不是对象值来比较值”，这是正确的。我将您的数据修改为数组对象关系，并使用md select默认值

对于问题2，plunk显示了如何将FormControl与NgModel结合使用。它们是互斥的，因此只能使用一个。还要注意的是，md select通过对象引用而不是对象值来比较值。谢谢您的回复，我已经完成了第一部分的工作。最后一个plunker链接是同一个链接，带有key:object-relation。如果你能粘贴一个有效的，那就太好了，因为我无法让问题2有效。很抱歉，我已经为第二部分添加了正确的链接。让我知道你的想法

<md-select [formControl]="form.controls['organism']" 
           style="width:100%;" 
           [(ngModel)]="selected.organism_id" 
           (change)="resetForm($event)">
  <md-option *ngFor="let organism_id of getIds()" [value]="organism_id">
    {{ organisms[organism_id].name }}
  </md-option>
</md-select>

resetForm(org){
  if(this.form.valid){
    this.selected.sub_organism_id = null;
  };  
}