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">

        <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"