Переключить значки сортировки в компоненте смарт-таблицы в angular7

Question

Я создал пользовательский угловой компонент смарт-таблицы с функциями сортировки, разбивки на страницы и фильтрации. Проблема в том, что сортировка работает правильно, но значки сортировки заголовка таблицы не работают должным образом. Я нашел несколько примеров, но все они для angularJS. Например я пытаюсь сделать что-то вроде этого: - http://jsfiddle.net/gdjc4y39/8/

Я пытался использовать ngclass, но при этом менялись все значки сортировки, даже если я щелкнул один из них.

<span  *ngIf="!this.toggleSortIcon"><i class="fas fa-sort"></i></span>
          <span  *ngIf="this.toggleSortIcon"><i [ngClass]="reverse ? 'fas fa-sort-down': 'fas fa-sort-up'"></i></span>

Answer 1

Решено! Я следовал той же процедуре, что и в ссылке Fiddle, которой я поделился, и она работала нормально. Добавьте этот код в HTML-файл <th *ngFor="let item of data; let i=index;" (click)="sort(item)">{{ item }} <span class="fas" [ngClass]="getIcon(item)"></span> </th> а в файл ts вы можете добавить объект 'sort' и два метода точно так же, как в скрипте.

Спасибо.