2

Angular 4 でレコードを一覧表示するために最新バージョンの PrimeNG テーブルを使用していp-drowpdownます。ドロップダウンからデータを選択すると、その値フィールドが列に表示されますが、代わりにラベル フィールドにする必要があります。

<p-column field="id" header="Name"  [sortable]="false" resizableColumns="true"
[filter]="true" filterPlaceholder="Search" [editable]="true" [style]="{'overflow':'visible'}">
    <ng-template let-col let-data="rowData" pTemplate="editor">
            <p-dropdown [(ngModel)]="data[col.field]" [autoWidth]="false" required="true" [options]="attributeOptionList" class="form-control" [style]="{'width':'100%','height':'32px'}"
        filter="filter" placeholder="Select Attribute"></p-dropdown>
    </ng-template>
</p-column>

例: ドロップダウンの例

値| ラベル

1 | ニューヨーク

2 | アウリ

都市 ID 1 を選択すると、その値ではなく Newyork (ラベル) が表示されます。現在、Newyork の代わりに 1 を表示しています

4

3 に答える 3

1

PrimeNG docを見ると、ブランド列の例があり、ドロップダウンから編集できます。そして、そのドロップダウンに送信されるオプションには、同じラベルと値があります。

したがって、色の SelectItem配列は次のようになります

[{label:'Orange', value:'Orange'}, {label:'Black', value:'Black'}]

それ以外の

[{label:'Orange', value:0}, {label:'Black', value:1}]

あなたの場合、次のようにその配列を埋めることができます：

this.colorNames.forEach(color => {
  this.colors.push({ label: color, value: color });
});

編集されたStackBlitzを見る

于 2019-06-15T08:53:15.557 に答える