Question

在我的Angular应用程序中有一个在页面加载时呈现的网格。当我点击一行时，我想重绘/重新渲染相同的网格。我这样做是因为点击一行会触发另一个远程数据的GET请求，以填充网格行内的div。当然，一旦我得到响应以显示响应中的所有数据，我需要更改网格的行高，这就是我需要重绘网格的原因。

在我的HTML中：

<ng-template #displayListData>

        <ag-grid-angular #agGrid style="width: 100%" class="ag-material grid-Holdings"
            [gridOptions]="gridOptions"
            [rowData]="rowData"
            [getRowHeight]="getRowHeight"
            headerHeight="46"
            (gridReady)="prepareGrid()"
            [isFullWidthCell]="isFullWidthCell"
            [doesDataFlower]="doesDataFlower"
            [fullWidthCellRendererFramework]="getFullWidthCellRenderer()"
            (rowClicked)="redrawGrid($event)">
        </ag-grid-angular>

</ng-template>

在我的组件中，我有一个方法redrawGrid（），当我点击一行时会触发它。在这个方法中，我尝试调用setRowHeight（）和resetRowHeight（），但它不起作用...方法触发但网格没有根据传递的新高度重绘：

redrawGrid(params: any): void {

    //TRIED BOTH DID NOT WORK
    params.node.setRowHeight(this.newRowHight);
    // this.gridOptions.api.resetRowHeights();
}

这是同一组件中的getRowHeight（）方法：

getRowHeight(params) {
        let isDetailRow = params.node.level === 1;
        let rowHeight: number = this.newRowHeight;
        // my new rowHeight or 48px
        return isDetailRow ? rowHeight : 48;
}

我是ag-Grid的新手，我想知道我是否过度使解决方案变得复杂......

Answer 1

经过一些实验，解决方法是在节点的childFlower上调用ag-Grid的setRowHeight，如下所示：

redrawGrid(params: any): void {
        params.node.childFlower.setRowHeight(this.globalRowCount * 34);

        this.gridOptions.api.onRowHeightChanged();
}

但是！但是......除非你拨打onRowHeightChanged()

，否则高度不会改变，网格也不会重绘

参见＆＃34;改变行高＆＃34;在https://www.ag-grid.com/javascript-grid-row-height/#gsc.tab=0

事件

1 个答案: