Angular MatSort.sortChange：尝试从函数更新排序时忽略事件数据答案

【问题标题】：Angular MatSort.sortChange: event data ignored when trying to update sort from functionAngular MatSort.sortChange：尝试从函数更新排序时忽略事件数据
【发布时间】：2018-05-13 08:00:57
【问题描述】：

我对 Angular Material 中的 MatSort.sortChange 的使用有疑问。

配置

角度 5.0.2.
angular/cdk": "^5.0.0-rc0"
角材料5.0.0-rc0

上下文

我有一个包含垫表和一些按钮的组件。当用户单击某些按钮时，表应重置为其初始状态。特别是，我想将排序顺序重置为“asc”。

有问题

基本上，我的解决方案是通过 MatSort.sortChange AND 手动更新 MatSort.direction 发出具有所需属性的新排序
- 如果两个操作之一不包括在内，排序重置不起作用

问题

我认为只发出一个 sortChange 就足够了
我是不是做错了什么？
有没有比下面提供的解决方案更好的解决方案？

提前感谢您的帮助！ :)

我的代码的相关部分

export class RoleMembersComponent implements OnInit, OnChanges {

@ViewChild('inputfilter') inputfilter: ElementRef;  
@ViewChild(MatPaginator) paginator: MatPaginator;
@ViewChild(MatSort) sort: MatSort;

ngOnInit() {
    // bug#5593 START: Added this.changeDetector.detectChanges();
    this.changeDetector.detectChanges();
    // bug#5593 END
    this.dataSource = new RoleMemberDatasource(this.database, this.paginator, this.sort);    
    this.onUserInteractionsWithTable();    
}


private onUserInteractionsWithTable () {
    const tableUserActionsListener = [
        this._inputFilterChange,
        this.paginator.page,
        this.sort.sortChange
    ];    
    mergeOfObservables.subscribe((data : any) => {
        // If internal sort do not load data again
        // because reset of _inputFilterChange already trigger reload.
        if (!this.isResetSort(data)) {
            this.loadData();
        } else {
            this.sort.direction = data.direction;            
        }
    }); 
}

private resetSort () {
    // TODO: The content of sort seems to be ignored.
    const sort    = <Sort>{
            active: this.defaultSortActiveFld, // works even if I put 'dummy'
            direction: this.defaultSortDirection,
            resetSort: true
        };
    this.sort.sortChange.emit(sort);
}

private isResetSort(obj: any): boolean {
    return (obj.resetSort);
}

【问题讨论】：

您找到解决方案了吗？
@donlaur：嗯，自从我写这篇文章以来，我已经让代码处于相同的状态。我的解决方法是有效的，但我没有得到任何关于这种行为是否真的异常或者只是我没有完全理解这个功能的回应

标签： angular angular5 angular-material2 angular-cdk

【解决方案1】：

我发现修改dataSource排序active和direction然后强制更新是可行的。

this.dataSource.sort.active = 'columnName';
this.dataSource.sort.direction = null; // reset or 'asc' / 'desc'
this.dataSource._updateChangeSubscription(); // force update table

【讨论】：