angular - 如何将 primeNg 下拉选择值设置为对象的 id 而不是整个对象

Question

我正在将集合数据绑定(bind)到 prime NG 下拉列表。

<p-dropdown [options]="statusTypes" formControlName="StatusTypeCode" optionLabel="Name">
</p-dropdown>

我将 formControlName 设置为此下拉列表，效果很好。唯一的问题是表单设置了整个对象(例如:statusTypes[2])。我希望表单为所选值指定一个值，而不是整个对象(例如:statusTypes[2].StatusTypeCode)

我知道我可以在设置之前重新创建选项...

this.statusTypes= [];
for (let statusType of this.allStatusTypes) {
   this.statusTypes.push({ label: (statusType.Name), value: statusType.StatusTypeCode });
}

但是我必须在每个下拉集合中都这样做!

在 HTML 中是否有任何方法可以只指定等于属性的下拉列表的值(例如:optionValue="StatusTypeCode")，这样我就可以用 id 而不是整个对象填充表单？

Answer 1

我不知道他们什么时候更新了这个，但是在 PrimeNG 文档中，Dropdown 具有属性“optionValue”，它将解决这个问题。我有一个小问题想从数组中选择 id 的对象，这就是我得到的

<p-dropdown id="dropdown" inputId="dropdown" optionValue="id" [autoDisplayFirst]="false" [options]="cities" formControlName="id" optionLabel="name"></p-dropdown>

现在它将选择 { id: '1' } 而不是 { id: '1', name: 'cityName' }