如何提高扩展所有节点的性能

时间:2019-07-12 14:56:55

标签: performance internet-explorer treetable primeng-treetable

以下代码成功地扩展了primeng树表中的所有节点,但是在Internet Explorer 11上执行非常的过程很慢。有许多节点需要扩展,打开所有节点可能需要30秒并显示下级数据。我想要一些有关如何使其运行更快的建议。

<p-confirmDialog [style]="{width: '50vw'}"></p-confirmDialog>
<p-treeTable #treeTable [value]="gridOptions.value" 
  [scrollable]="gridOptions.scrollable" 
  [scrollHeight]="gridOptions.scrollHeight" 
  [selectionMode]="gridOptions.selectionMode"
  [(selection)]="gridOptions.selection" [dataKey]="gridOptions.dataKey" 
  [metaKeySelection]="gridOptions.metaKeySelection" >
     <ng-template pTemplate="header">
       <tr *ngFor="let row of headerRows">
         <th *ngFor="let col of row.cols" [style.width]="col.width " 
           [attr.colspan]="col.colspan"
          [attr.rowspan]="col.rowspan" class="align-header"><span> 
          {{col.headerName}}</span></th>
       </tr>
 </ng-template>
 <ng-template pTemplate="body" let-rowNode let-rowData="rowData">
    <tr [ngClass]="rowData.CLASS_ROW" [ttRow]="rowNode" 
    [ttSelectableRow]="rowNode">
       <td *ngFor="let col of dataCols; let i = index" 
         [style.width]="col.width" [ngClass]="col.headerClass"
         (dblclick)="clickCell($event,col,rowData)">
            <p-treeTableToggler [rowNode]="rowNode" *ngIf="i == 0"></p- 
            treeTableToggler>
           <span [ngClass]="rowData[col.field+'_CELL_CLASS']"> 
            {{rowData[col.field] ? rowData[col.field] : 0}}</span>
          </td>
        </tr>
     </ng-template>
  </p-treeTable>

以下回调函数(通过按下按钮调度)触发所有节点,子代和子代子的扩展:

@viewChild('treeTable') treeTable : TreeTable ;
expandAll(nodes: TreeNode[],  children: boolean) 
{
nodes.forEach((node) => {
    node.expanded = true;
    this.expandAll(node.children,true);
})
if(!children){
  this.refreshTable();
}
}
public refreshTable() {
  this.treeTable.updateSerializedValue();
  this.treeTable.tableService.onUIUpdate(this.treeTable.value);
}

0 个答案:

没有答案