Я создал p-таблицу с горизонтальной и вертикальной прокручиваемой таблицей, используя PrimeNG. Он содержит больше строк и столбцов.
Здесь я столкнулся с проблемами, когда невозможно настроить ширину столбца автоматически вместо ширины жесткого кодирования.
<ng-template pTemplate="colgroup" let-columns>
<colgroup>
<col *ngFor="let col of columns" style="width: 200px">
</colgroup>
</ng-template>
Ниже приведен код.
<p-table [columns]="th" [value]="tbody" [rows]="100" [paginator]="true"
[totalRecords]="resultCount"
[lazy]="true" (onLazyLoad)="pagination($event)"
[pageLinks]="3" [rowsPerPageOptions]="[100]" scrollable="true" scrollHeight="500px">
<ng-template pTemplate="colgroup" let-columns>
<colgroup>
<col *ngFor="let col of columns" style="width: 200px">
</colgroup>
</ng-template>
<ng-template pTemplate="header" let-columns>
<tr>
<th *ngFor="let col of columns">
<div class="table-header">
{{col.field}}
</div>
</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>
Here, all the columns are dynamic and most of the time more than 100 different kind of column names. For Ex: Columns names like
Кроме того, нам нужно обернуть столбцы, содержащие меньше текста, например: столбец идентификатора
Мне нужно добиться этого с помощью вертикальной и горизонтальной прокрутки. Вы можете мне помочь?
Ценю вашу помощь!!!