Angular2 反应形式:验证 *ngIf 中的字段

Question

我有一个包含md-select和md-radio-button字段的表单。单选按钮下的选项将根据在 md-select 中选择的选项显示。请访问弹坑。

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

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

Answer 1

将change事件添加到md-select，以便在选择更改且表单已验证时，您可以将selected.sub_organism_id的值重置为null。这将使表格无效。

代码片段：

.html：

<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>

TS：

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

编辑 普伦克

更新：

就像@WillHowell在他的评论中所说的那样，"md-select 通过对象引用而不是对象值来比较值"，这是真的。我将您的数据修改为数组-对象关系，md-select 默认值在这里起作用。