假設我有一個覆寫模式頁面 students-overlay.component.html
<ng-container *ngIf="{ students: students$ | async} as values">
<label>Students</label>
<p-multiSelect
appendTo="body"
formControlName="students"
display="chip"
[options]="values.students ? values.students : []"
[style]="{'width':'100%'}"
placeholder="Bitte ausw?hlen"
optionLabel="secondname"
filterBy="secondname"
optionValue="userId">
</p-multiSelect>
和一個基礎表模板(students.component.html)
<p-table [value]="studentdata"
selectionMode="single" [(selection)]="selectedStudents"
(onRowSelect)="onStudentsSelect()"
(onRowUnselect)="onStudentsUnselect()"
styleClass="p-datatable-striped p-datatable-sm">
<ng-template pTemplate="header">
<tr>
<th style="width: 14em">Student</th>
<th style="width: 2em"></th>
</tr>
</ng-template>
<ng-template pTemplate="body" let-item>
<tr [pSelectableRow]="item">
<td>{{item.students}}</td>
<td style="text-align: right">
</ng-template>
</p-table>
在 students-overlay.component.html 中使用 optionValue 只給了我 userId 但我需要類似的東西
{{item.userId}} - {{item.secondname}} - {{item.lastname}}
是否有可能在屬性 optionValue 中使用第二個值?
uj5u.com熱心網友回復:
您可以使用 pTemplate 指令為primeng multi select 提供自定義模板
<label>Students</label>
<p-multiSelect
appendTo="body"
display="chip"
[options]="students"
[style]="{ width: '100%' }"
placeholder="Bitte ausw?hlen"
optionLabel="name"
filterBy="secondname"
optionValue="userId"
>
<ng-template let-student pTemplate="item">
<div class="country-item">
<div>
{{ student.userId }} - {{ student.secondname }} - {{ student.lastname }}
</div>
</div>
</ng-template>
</p-multiSelect>
作業示例
轉載請註明出處,本文鏈接:https://www.uj5u.com/houduan/452433.html
