Angular 4组件中如何捕获下拉框ngValue绑定的policyType.id值？

嘿，我来帮你搞定这个问题！其实你已经在代码里做了关键的绑定，有两种简单的方式拿到选中的policyType.id：

方法一：直接用双向绑定的ngModel值 #

你已经给select加了[(ngModel)]="editableLob.coveragePolicyTypeId"双向绑定，而且每个option的[ngValue]绑定的正是policyType.id——这意味着选中的id会自动同步到this.editableLob.coveragePolicyTypeId变量里，根本不用从$event里费劲提取！

修改你的组件方法就行：

coveragePolicyTypeChanged() {
  // 直接用这个变量就是选中的policyType.id
  const selectedPolicyTypeId = this.editableLob.coveragePolicyTypeId;
  console.log('选中的政策类型ID:', selectedPolicyTypeId);
  
  this.updateCedingComission(this.showCededComission && this.editableLob.isCededCommision);
}

这种方法最简洁，也是Angular双向绑定的设计初衷，推荐优先用它。

方法二：从change事件的$event中提取值 #

如果一定要通过$event获取，也可以这样做，但要注意类型转换（因为$event.target.value返回的是字符串，而你的policyType.id应该是数字类型）：

coveragePolicyTypeChanged($event) {
  // 从事件对象里拿到选中值
  const selectedIdStr = $event.target.value;
  // 转成数字类型，和你的policyType.id类型匹配
  const selectedPolicyTypeId = Number(selectedIdStr);
  
  console.log('选中的政策类型ID:', selectedPolicyTypeId);
  this.updateCedingComission(this.showCededComission && this.editableLob.isCededCommision);
}

另外提个小建议：你的select标签里已经有required属性，记得确保editableLob.coveragePolicyTypeId初始值不要和默认disabled选项的defaultPolicyType冲突，避免表单验证出问题哦～

内容的提问来源于stack exchange，提问作者Tom