Значок сортировки PrimeNG TurboTable не отображается при включенной сортировке по умолчанию

Когда сортировка по умолчанию включена в PrimeNG TurboTable, значок сортировки не отображается при начальной загрузке, заголовок столбца имеет стиль, соответствующий его использованию, и данные сортируются правильно. Значок сортировки появляется, когда я вручную нажимаю на заголовок для повторной сортировки.

скриншот

HTML:

<p-table [columns]="columns" [value]="users" sortField="name" sortOrder="1">
  <ng-template pTemplate="header" let-columns>
    <tr>
      <th *ngFor="let col of columns" [pSortableColumn]="col.field">
        {{col.header}}
        <p-sortIcon [field]="col.field"></p-sortIcon>
      </th>
    </tr>
  </ng-template>
  <ng-template pTemplate="body" let-user let-columns="columns">
    // body ...
  </ng-template>
</p-table>

составная часть:

    this.columns = [
      {field: 'name', header: 'Name'},
      {field: 'email', header: 'email'}
    ]

Есть ли способ отобразить значок сортировки в отсортированном по умолчанию столбце?


person dnk    schedule 24.05.2019    source источник
comment
Вы можете попробовать связать sortOrder следующим образом... [sortOrder]="1", чтобы значение можно было рассматривать как число, а не строку. Иногда трудно понять, будет ли строка преобразована в число в коде PrimeNG.   -  person Dale Harris    schedule 26.05.2019
comment
Или попробуйте добавить привязку свойства sortMode.   -  person Dale Harris    schedule 26.05.2019
comment
@DaleHarris [sortOrder]=1 сработало, спасибо!   -  person dnk    schedule 27.05.2019
comment
Я не был уверен, поэтому оставил комментарий вместо ответа. Я продолжу и опубликую это как ответ на случай, если кому-то еще понадобится информация.   -  person Dale Harris    schedule 27.05.2019


Ответы (1)


Если вы привяжете свойство sortOrder следующим образом...

[sortOrder]="1"

... значение будет рассматриваться как число, а не как строка. Иногда трудно понять, будет ли строка преобразована обратно в число в коде PrimeNG.

Я рекомендую использовать [brackets] для всех привязок свойств шаблона Angular. В противном случае тип будет рассматриваться как строка, что может привести к ошибкам.

Это особенно проблематично с булевыми значениями, поэтому я всегда рекомендую такой синтаксис:

[doSomething]="false"

И если строка действительно нужна, этот синтаксис поможет:

[myProp]="'myString'"
person Dale Harris    schedule 27.05.2019