PrimeNG Dropdown如何在单个optionLabel内设置两个展示值

你当前写法不生效的原因是 p-dropdown 的 optionLabel 属性仅支持传入单个字符串类型的字段名，不支持直接传入多字段组合的对象/数组，无法自动完成字段拼接逻辑，可通过以下两种方式实现需求：

• 方案一：预处理数据源，新增拼接后的自定义字段
  拿到后端返回的divitionArr数据后，遍历数组为每一项新增一个自定义显示字段，后续直接将该字段绑定到optionLabel即可：

// 接口请求拿到返回数据后处理
this.divitionArr = res.data.map(item => ({
  ...item,
  // 拼接两个字段为新的显示值
  fullLabel: `${item.first_name} ${item.last_name}`
}))

模版写法调整为：

<p-dropdown [options]="divitionArr" name="business_divition" [(ngModel)]="project.business_divition" optionLabel="fullLabel" optionValue="divition" #diviSel="ngModel"></p-dropdown>

• 方案二：使用p-dropdown自定义模板能力（无需修改原始数据）
  通过pTemplate属性自定义下拉选项和选中项的显示内容，灵活度更高，适合需要额外定制选项样式的场景：

<p-dropdown [options]="divitionArr" name="business_divition" [(ngModel)]="project.business_divition" optionValue="divition" #diviSel="ngModel">
  <!-- 自定义下拉展开后的选项显示内容 -->
  <ng-template let-option pTemplate="item">
    {{ option.first_name }} {{ option.last_name }}
  </ng-template>
  <!-- 自定义选中后输入框内的显示内容 -->
  <ng-template let-selected pTemplate="selectedItem">
    {{ selected ? `${selected.first_name} ${selected.last_name}` : '' }}
  </ng-template>
</p-dropdown>

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