Turbo Table - Default Sorting Indicator

UI Components for Angular
Post Reply
dsmsql
Posts: 2
Joined: 20 Nov 2018, 20:36

20 Nov 2018, 20:43

I am attempting to use Turbo Table from Prime NG version 6.1.6, and when I include the sortOrder="-1" on my <p-table> tag, it does the sorting appropriately, but it does not display the sort arrow in the column, if I click on the column to sort the other direction, the arrow does display. Am I missing something, or is this an issue with this version of PrimeNG?

Code: Select all

  <p-table 
    #dt
    [columns]="selectedColumns" 
    [value]="logs" 
    sortMode="single" 
    sortField="timeStamp" 
    sortOrder="-1"
    [paginator]="true" 
    [rows]="10"
    [resizableColumns]="true"
    [reorderableColumns]="true"
    [responsive]="true">

    <ng-template pTemplate="caption">
      <div class="row container-fluid" >
        <div class="col-md-2">
            <p-multiSelect 
            [options]="cols" 
            [(ngModel)]="selectedColumns" 
            optionLabel="header" 
            selectedItemsLabel="{0} columns selected" 
            [style]="{width: '100%'}" 
            defaultLabel="Choose Columns">
          </p-multiSelect>
        </div>
        <div class="col-md-3">  
          <input type="text" pInputText size="50" placeholder="Search" (input)="dt.filterGlobal($event.target.value, 'contains')" style="width:auto">
        </div>
      </div>
    </ng-template>

    <ng-template pTemplate="header" let-columns>
      <tr>
        <th *ngFor="let col of columns" [pSortableColumn]="col.field" pResizableColumn pReorderableColumn>
          {{col.header}}
          <p-sortIcon [field]="col.field"></p-sortIcon>
        </th>
      </tr>
    </ng-template>

    <ng-template pTemplate="body" let-log let-columns="columns">
      <tr>
        <td *ngFor="let col of columns" [ngSwitch]="col.field" class="ui-resizable-column">
          <pre lang="xml" *ngIf="col.field == 'properties'; else normal">
              {{log[col.field]}}
          </pre>
          <ng-template #normal>
              {{log[col.field]}}
          </ng-template>
        </td>
      </tr>
    </ng-template>
  </p-table>

Post Reply

Return to “PrimeNG”

  • Information
  • Who is online

    Users browsing this forum: No registered users and 7 guests