Angular 无法以角度绑定选择选项

我正在尝试将此数据绑定到下拉列表或选择选项。该值未绑定到表单控制器。这个问题是以下问题的延伸：

Component.html

 <div class="col-md-6">
     <label class="col-md-6 col-form-label padding-bottom-Mini">Rule Type</label>
        <div class="col-md-12">
            <select class="form-control" formControlName="ruleTypeName">
                <option [ngValue]="null" disabled>Choose your Rule Types</option>
                 option *ngFor="let rule of ruleTypes" [value]="rule">  {{ rule.ruleTypeName }}</option>
            </select>
        </div>
</div>  

---

不知道我在这里遗漏了什么…请帮助提供相关数据。

您需要更改模板中的值属性

<div class="col-md-6">
     <label class="col-md-6 col-form-label padding-bottom-Mini">Rule Type</label>
        <div class="col-md-12">
            <select class="form-control" formControlName="ruleTypeName">
                <option [ngValue]="null" disabled>Choose your Rule Types</option>
                 <option *ngFor="let rule of ruleTypes" [value]="rule.ruleTypeName">  {{ rule.ruleTypeName }}</option>
            </select>
        </div>
</div>  

规则类型
选择规则类型
{{rule.ruleTypeName}}

我试图用一个简单的片段重现您的行为，但它对我有效。以下是stackblitz:。你能分享一个展示不工作行为的stackblitz吗？注：代替

if（this.ruleTypes[this.ruleTypes.findIndex（s=>s.ruleTypeName==data.editDataItem.ruleType）]！==undefined）{

say

if（this.ruleTypes.some（s=>s.ruleTypeName==data.editDataItem.ruleType））{

Hi MoxxiManagarm，请检查此项，例如，对数组、数组类型等进行少量更改。您缺少一个“您的选择存储值<代码>选项，但您的formcontrol有一个<代码>字符串值。您需要将

[value]

标记更改为

[value]=“option.Name”

。请参见此处：@bahadrdsr，哪一行？{option.Name}

<div class="col-md-6">
     <label class="col-md-6 col-form-label padding-bottom-Mini">Rule Type</label>
        <div class="col-md-12">
            <select class="form-control" formControlName="ruleTypeName">
                <option [ngValue]="null" disabled>Choose your Rule Types</option>
                 <option *ngFor="let rule of ruleTypes" [value]="rule.ruleTypeName">  {{ rule.ruleTypeName }}</option>
            </select>
        </div>
</div>