如何在元素重新渲染后将先前（重新渲染之前）值设置为 ag-grid Cell Renderer 输入元素？答案

【问题标题】：How to set previous(before re-rendering) value to ag-grid Cell Renderer input element after the element re-rendering?如何在元素重新渲染后将先前（重新渲染之前）值设置为 ag-grid Cell Renderer 输入元素？
【发布时间】：2020-05-11 01:22:29
【问题描述】：

我在 Angular 项目中有单元格渲染类，可在 ag-grid 单元格中生成 html 输入模板。水平滚动后，随着输入单元格离开屏幕，ag-grid 重新渲染这些输入元素并且输入元素失去它们的值。下面是我的 CellRenderer 类：

export class TemplateRendererComponent implements ICellRendererAngularComp {
  template: TemplateRef<any>;
  templateContext: { $implicit: any, params: any };

  refresh(params: any): boolean {
    this.templateContext = {
      $implicit: params.data,
      params,
    };
    return true;
  }

  agInit(params: ICellRendererParams): void {
    this.template = params[ 'ngTemplate' ];
    this.refresh(params);
  }
}

如何使这个输入元素保持它们的值？

【问题讨论】：

您能否在您的 ag 网格组件中缓存更新的输入值并作为 cellRendererParams 传递？
如果找不到其他方法，我认为这是我必须做的最后一个选择。例如，如何告诉 ag-grid 不破坏 CellRenderer 组件或元素
除了作为 cellRendererParam 发送之外，您还可以在渲染器的 destroy 方法中缓存该值，一旦单元格离开屏幕，单元格渲染器就会被销毁，这是有道理的。没有办法阻止它
suppressColumnVirtualisation ag-grid 属性设置为 true 以呈现所有列。终于在文档中找到了。这就是我的解决方案。
请将此作为您的答案

标签： javascript angular ag-grid ag-grid-angular

【解决方案1】：

根据cellRenderer 生命周期，一旦它不在视野范围内就会被销毁。

您可以实现ngOnDestroy() 并在单元格渲染器被破坏之前访问最后一个已知值。

  ngOnDestroy() {
    // do your stuff here
  }

您可以将此值存储在 redux 存储或服务中。

然后在重新初始化渲染器时可以在agInit() 中访问这个值。

【讨论】：

【解决方案2】：

" suppressColumnVirtualisation：设置为 true 以便网格不会虚拟化列。例如，如果您有 100 列，但由于滚动而只有 10 列可见，则始终呈现全部 100 列。默认值：假“ 来源：https://www.ag-grid.com/javascript-grid-properties/

【讨论】：