取消选中 px-data-table 中的所有行
Unchecking all the rows in px-data-table
我在 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 调用它,我就会有解决问题的方法:取消选中选定的行。
任何解决方案都会有所帮助。
注意到 _setAllRows(e)
是 aha-table
的一个方法,它是嵌套在 px-data-table
组件下的一个组件,根据 [=16 的 Polymer 文档访问该方法很容易=].
let tableRef = this.myTableRef.nativeElement;
tableRef.$$('aha-table')._setAllRows(false);
基本上$$('selector')
是动态创建节点的聚合物shorthand。如果我获得 aha-table
节点的引用,我可以调用它的方法。
我在 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 调用它,我就会有解决问题的方法:取消选中选定的行。
任何解决方案都会有所帮助。
注意到 _setAllRows(e)
是 aha-table
的一个方法,它是嵌套在 px-data-table
组件下的一个组件,根据 [=16 的 Polymer 文档访问该方法很容易=].
let tableRef = this.myTableRef.nativeElement;
tableRef.$$('aha-table')._setAllRows(false);
基本上$$('selector')
是动态创建节点的聚合物shorthand。如果我获得 aha-table
节点的引用,我可以调用它的方法。