我正在使用PrimeNG p表在Angular 6项目中显示数据表。在桌面版本中,表的列大小调整非常适合。但是在“移动和平板电脑”视图中,它没有提供调整大小的选项。下面是我的代码:
<p-table #dtData [columns]="selectedColumns" resizableColumns="true" (sortFunction)="customSort($event)" [customSort]="true" [style]="{width:'100%'}" [(selection)]="selectedItem" [rowHover]="true" [dataKey]="tableKey" [value]="tableData" [scrollable]="true" [ngClass]="!headerExpandFlag?'ptable-main-expand-cls':'ptable-main-cls'" scrollHeight="250px" >
<ng-template pTemplate="colgroup" let-columns>
<colgroup>
<col *ngFor="let col of columns" >
</colgroup>
</ng-template>
<ng-template pTemplate="header" let-columns>
<tr>
<th>
<p-tableHeaderCheckbox (click)="toggleSelect(rowData,$event)"></p-tableHeaderCheckbox>
</th>
<th *ngFor="let col of columns" pResizableColumn pReorderableColumn [pSortableColumn]="col.field" >
{{col.header}}
<p-sortIcon [field]="col.field" ariaLabel="Activate to sort" ariaLabelDesc="Activate to sort in descending order" ariaLabelAsc="Activate to sort in ascending order"></p-sortIcon>
</th>
</tr>
</ng-template>
<ng-template pTemplate="emptymessage">
<div class="empty-message-week" >
<span class="empty-txt"> No Record Found </span>
</div>
</ng-template>
<ng-template pTemplate="body" let-rowData let-rowIndex="rowIndex" let-columns="columns" class="ui-resizable-column">
<tr [pSelectableRow]="rowData" (click)="onRowClick($event,rowData)">
<td>
<p-tableCheckbox (click)="toggleSelect(rowData,$event)" [value]="rowData"></p-tableCheckbox>
</td>
<td *ngFor="let col of columns" [ngClass] = "displayColor(col.field, rowData)" (click)="openLink(rowData,col.field,$event)">
<span pTextEllipsis matTooltipClass="tool-tip" [matTooltip]="rowData[col.field]" [matTooltipPosition]="'above'" >
{{rowData[col.field]}}
</span>
</td>
</tr>
</ng-template>
<ng-template pTemplate="footer" >
<div fxLayout="row" class="caption-style"></div>
</ng-template>
</p-table>
PrimeNG表格列的大小可以在手机或平板电脑视图中工作吗?
预先感谢!