Up or down arrow appears next to column header when the data is sorted

[pratiksha-chandel]

NOt working as expected . what change expected here?

import {Component, Input, OnInit} from "@angular/core";
import {DataTable, SortEvent} from "./DataTable";

@component({
selector: "mfDefaultSorter",
template: <a style="cursor: pointer" (click)="sort()" class="text-nowrap"> <ng-content></ng-content> <span *ngIf="isSortedByMeAsc" class="glyphicon glyphicon-triangle-top" aria-hidden="true"></span> <span *ngIf="isSortedByMeDesc" class="glyphicon glyphicon-triangle-bottom" aria-hidden="true"></span> </a>
})
export class DefaultSorter implements OnInit {
@input("by") sortBy: string;

isSortedByMeAsc: boolean = false;
isSortedByMeDesc: boolean = false;

public constructor(private mfTable: DataTable) {
}

public ngOnInit(): void {
    this.mfTable.onSortChange.subscribe((event: SortEvent) => {
        this.isSortedByMeAsc = (event.sortBy == this.sortBy && event.sortOrder == "asc");
        this.isSortedByMeDesc = (event.sortBy == this.sortBy && event.sortOrder == "desc");
    });
}

sort() {
    if (this.isSortedByMeAsc) {
        this.mfTable.setSort(this.sortBy, "desc");
    } else {
        this.mfTable.setSort(this.sortBy, "asc");
    }
}

}

[kevinding0218]

@pratiksha-chandel you can do as following:
step 1: check if you have "glyphicon" installed in your application,
step 2: remove "aria-hidden="true" from DefaultSorter.ts
step 3: try to replace it with "fa fa-sort-up" or "fa fa-sort-down"