PrimeNg p-dropdown不显示数组值

Question

我有使用PrimeNg p-dropdown的组件。 HTML代码：

<p-dropdown [style]="{'width':'150px'}" [options]="portNames" placeholder="Select a Port">
</p-dropdown>

ts portNames声明：

portNames: string[] =["Port 01","Port 02", "Port 03"];

我的问题是DropDown不显示值“端口01”，“端口02”，“端口03”。

也许我有任何错误？

Answer 1

尝试在标签和值中添加下拉值

portNames =[
{label:'Port 01', value:'Port 01'},
{label:'Port 02', value:'Port 02'},
{label:'Port 03', value:'Port 03'},
];

Answer 2

portNames应该是一个由标签和值组成的对象数组（不是字符串数组）：

portNames = [
        {label:'Port 01', value:'p01'},
        {label:'Port 02', value:'p02'},
        {label:'Port 03', value:'p03'}
        ];

见Plunker

Answer 3

没有必要在下拉值中使用标签和值。您可以在p-dropdown中设置optionLabel属性。这意味着将从对象属性读取值，与optionLabel属性中设置的值相同，并且在调用item.label或selectedItem.label时将显示。