PrimeNG下拉组件位于其他组件之后,而不是其他组件之后

时间:2018-11-14 08:01:16

标签: html angular primeng primeng-dropdowns

美好的一天

我最近从PrimeFaces移到了PrimeNG。

但是我遇到了一个错误,即我的下拉列表位于其下方的组件后面,而不是其上方/上方。

这是屏幕截图:

enter image description here

这是我的代码:

<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。

谢谢。

0 个答案:

没有答案