使用gridNode更新单元格值后,Ag-grid定制工具提示不起作用,但刷新后起作用。
ag网格版本20.1.0,使用rowNode.setDataValue('product',10)更新单元格值后,自定义工具提示未显示结果; ,值会在单元格中更新,但悬停时该值不会预览。
<ag-grid-angular
class="ag-theme-balham grid"
[rowData]="rowData"
[animateRows]="true"
rowHeight="38"
[enableRangeSelection]="true"
[enableFilter]="true"
[enableSorting]="true"
[enableColResize]="true"
[sideBar]="sideBar"
[columnDefs]="columnDefs"
[domLayout]="autoHeight"
(gridReady)="onGridReady($event)"
(rowClicked)="rowClicked($event)"
[autoGroupColumnDef]="autoGroupColumnDef"
[rowGroupPanelShow]="rowGroupPanelShow"
[suppressNoRowsOverlay]="true"
[suppressDragLeaveHidesColumns]="true"
[suppressMakeColumnVisibleAfterUnGroup]="true"
[frameworkComponents]="frameworkComponents"></ag-grid-angular>
in TS:
----------
and setting cell value like this in the aggrid programtiaclly.
const id = this.selectedRow['id']; (grid - id -- dynamicvalue)
const rowNode = this.gridApi.getRowNode(id);
rowNode.setDataValue('status', 1);
this.frameworkComponents = {
customTooltipComponent: CustomTooltipComponent
};
CustomTooltipComponent:-
---------------------------------------------------------------
import { Component, OnInit, ViewEncapsulation } from '@angular/core';
import { ITooltipAngularComp } from 'ag-grid-angular';
@Component({
selector: 'app-custom-tooltip',
template: `<div class="custom-tooltip">
<div *ngIf="imageViewer"><img [src]="params.value" alt="" /></div>
<div *ngIf="imageViewer === false">{{ params.value }}</div`,
styleUrls: ['./custom-tooltip.component.scss']
})
class CustomTooltipComponent implements ITooltipAngularComp {
private params: any;
private data: any;
public imageViewer: boolean;
agInit(params): void {
this.params = params;
}
}
-----------------------------------------------------------------------
我的预期结果是在设置值之后,在单元格上悬停时,我需要将更新后的值作为工具提示,而无需刷新。
答案 0 :(得分:0)
在表的 defaultColDefs 中,尝试直接使用工具提示键,如下所示:
this.defaultColDef ={
tooltip: (params) => {
return params.name;
}