Mat-table reset mat-sort to initial state

I don't know if you still need help with this, but I encountered the same issue and here's my solution. After you reset the active and direction for your sort, add the following line:

this.sort._stateChanges.next();

This should remove the sort arrow from your UI. Hopefully this helps!


For anyone else looking for an answer for this particular problem. As ericbea pointed out in the comments, Angular is aware of this problem and an issue is still open on github about this: https://github.com/angular/components/issues/10242. The only workaround that I found that worked for me is also listed there. It's something like this:

this.sort.sort({ id: null, start: 'desc', disableClear: false });
this.sort.sort({ id: 'comp_name_sort', start: 'asc', disableClear: false });
(this.sort.sortables.get('comp_name_sort') as MatSortHeader)._setAnimationTransitionState({ toState: 'active' });

The first line is used to clear the sort in case the column you want the sort to is currently the active column.