Primeng 9 表,水平滚动问题

问题描述

我正在尝试在与 https://www.primefaces.org/primeng/v9-lts/#/table/scroll 中给出的类似的primeng 表中实现整页滚动。但我没有得到水平滚动条。甚至标题和列也未对齐,如下所示:

enter image description here

请指教。 我的代码如下:-

<p-table [columns]="cols" [value]="cars2" [scrollable]="true" [style]="{width:'300px'}">

  <ng-template pTemplate="colgroup" let-columns>
    <colgroup>
      <col *ngFor="let col of columns" style="width:150px">
    </colgroup>
  </ng-template>
  <ng-template pTemplate="header" let-columns>
    <tr>
      <th *ngFor="let col of columns">
        {{col.header}}
      </th>
    </tr>
  </ng-template>
  <ng-template pTemplate="body" let-rowData let-columns="columns">
    <tr>
      <td *ngFor="let col of columns">
        {{rowData[col.field]}}
      </td>
    </tr>
  </ng-template>
</p-table>

我的项目中包含的主要 ng 相关包:

"primeflex": "1.1.0","primeicons": "^2.0.0","primeng": "^9.1.3",

解决方法

原因是因为 angular.json/styles 部分中缺少“node_modules/primeng/resources/primeng.css”条目。