美好的一天
我最近从PrimeFaces移到了PrimeNG。
但是我遇到了一个错误,即我的下拉列表位于其下方的组件后面,而不是其上方/上方。
这是屏幕截图:
这是我的代码:
<div class="box">
<form [formGroup]="projectForm" (submit)="submit()">
<h3>Create New Project</h3>
<br/>
<div class="table-responsive">
<table class="table table-bordered table-sm w-auto">
<tbody>
<tr>
<td>
<b>Project Leader: </b>
</td>
<td>
<p-dropdown [options]="employees" [(ngModel)]="project.leader" [filter]="true"
optionLabel="fullNames" placeholder="Select an Employee" [appendTo]="body"
formControlName="leader" [style]="{width: 'auto'}">
<ng-template let-itemData pTemplate="selectedItem">{{itemData.value.preferredName}}
{{itemData.value.lastName}}
</ng-template>
<ng-template let-itemData pTemplate="item">{{itemData.value.preferredName}}
{{itemData.value.lastName}}
</ng-template>
</p-dropdown>
</td>
</tr>
<tr>
<td>
<b>Project Name: </b>
</td>
<td>
<input pInputText [(ngModel)]="project.name" formControlName="name" style="width: 100%"
size="100">
</td>
</tr>
<tr>
<td>
<b>Rate Table: </b>
</td>
<td>
<p-dropdown [options]="projectRateTables" [(ngModel)]="selectProjectRate" [filter]="true"
[style]="{width: 'auto'}" [appendTo]="body"
optionLabel="name" placeholder="Select a Rate Table"
formControlName="projectRateTable">
</p-dropdown>
</td>
</tr>
</tbody>
</table>
</div>
<button pButton type="submit" label="Submit" icon="fa fa-save"
style="float: right">
</button>
</form>
</div>
如何解决此问题,以免发生这种情况?然后是一个单独的,有点相关的问题,即PrimeFaces panelGrid组件的PrimeNG等效项是什么。我使用Bootstrap表创建表单的原因是因为找不到与PrimeNG等效的panelGrid。
谢谢。