ag-grid自定义工具提示在单元格值更新后不起作用，仅在刷新网格后起作用

Question

Ag-grid custom tooltip not working after cell value updation using rowNode, but working after refresh.

ag grid version 20.1.0, custom tooltip not showing results after cell value updation using rowNode.setDataValue('product', 10); , value gets updating in the cell but on hover the value is not previewing.

<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;
           }

}
-----------------------------------------------------------------------

my expected result is after setting value, on hover of cell, i need to see the updated value as tooltip, with out refresh.

Answer 1

In your defaultColDefs of table try using tooltip key directly as follows:

this.defaultColDef ={
      tooltip: (params) => {
        return params.name;
      }