取消选中 px-data-table 中的所有行

Question

我在 Angular2 应用程序中使用 px-data-table。 data-table 用法如下：

<px-data-table #myTableRef [tableData]='tableDetails' language="en" (px-row-click)="selectedChanged($event)" (px-select-all-click)="selectAll($event)" sortable selectable show-column-chooser>
    <px-data-table-column *ngFor="let header of headers" type="html" name="{{header.value}}" label="{{header.label}}" [disableHide]="header.disableHide" [hide]="!header.disableHide">
    </px-data-table-column>
</px-data-table>

用户选择了不止一行。所以 selectedChanged($event) 被触发并选择了多行。现在我希望不通过用户交互从代码中取消选中选定的行。我采用了以下方法（无效）：

火灾事件 'px-select-all-click' 来自 Angular 作者：

this.myTableRef.nativeElement.fire('px-select-all-click')
this.myTableRef.nativeElement.fire('px-select-all-click', this.myTableRef.nativeElement.selectedRows)
// also did a ChangeDetectorRef.detectChanges() after injection but it did not work.

Select id 为 'selectAllCheckbox' 的复选框来自 Angular by:

this.myTableRef.nativeElement.shadowRoot.querySelector('selectAllCheckBox')
this.myTableRef.nativeElement.querySelector('selectAllCheckbox')
//returns null in both cases so I can't do a .click() on it

清空 selectedRows 属性：

this.myTableRef.nativeElement.selectedRows = [];

三种方法都不行。我正在查看 px-data-table.html 中导入的 aha-table.html 并找到了一个方便的方法：_setAllRows(e) 取消选择带有 _setAllRows(false) 的所有行。如果只有它被公开或者我可以从 Angular 调用它，我就会有解决问题的方法：取消选中选定的行。

任何解决方案都会有所帮助。

Answer 1

注意到 _setAllRows(e) 是 aha-table 的一个方法，它是嵌套在 px-data-table 组件下的一个组件，根据 [=16 的 Polymer 文档访问该方法很容易=].

let tableRef = this.myTableRef.nativeElement;
tableRef.$$('aha-table')._setAllRows(false);

基本上$$('selector')是动态创建节点的聚合物shorthand。如果我获得 aha-table 节点的引用，我可以调用它的方法。

取消选中 px-data-table 中的所有行

Unchecking all the rows in px-data-table

javascript

angular

typescript

polymer-1.0

predix