Question

我正在尝试创建一个单元格渲染器，该渲染器将从其他列中获取数据。

例如，每一行表示某些数据，用户应能够根据其权限打开它，并且受限数据的呈现方式应与非受限元素的呈现方式不同。其他列也会影响这一列的显示。

我希望能够使用路径this.params.node.data.restricted访问其他列的数据，并且这在click事件期间有效，但是在渲染的呈现阶段，我似乎无法访问此数据。组件。

"columnDefs": [
    {
      "field": "id",
      "width": 40,
      "checkboxSelection": true
    },
    {
      "headerName": "Title",
      "field": "docTitle",
      "width": 1580,
      "cellRenderer": "detailViewRenderer"
    }
  ]

import {Component} from "@angular/core";
import {ICellRendererAngularComp} from "ag-grid-angular";

@Component({
  selector: 'detail-view-renderer',
  styles: [``],
  template: `
    <a class="restricted" *ngIf="params.node.data.restricted">{{params.value}}</a>
    <a class="not-restricted" *ngIf="!params.node.data.restricted">{{params.value}}</a>
  `
})
export class DetailViewRendererComponent implements ICellRendererAngularComp {
  public params: any;

  agInit(params: any): void {
    this.params = params;
  }

  constructor() {}

  refresh(): boolean {
    return false;
  }
}

我认为理想情况下，我想做的是设置将传递到渲染器中的列，并以某种方式在组件中访问它们作为参数。有可能吗？还是有其他解决方法？我看到Full Width Rows是一个选择，但这会将整个行呈现为一列。

Answer 1

我认为您可以使用params.data.restricted而不是params.node.data.restricted来访问其他行属性。

例如

method() {
 const detailViewRenderer = params => {
   return `<span>${params.data.restricted}</span>`;
 };


 this.columnDefs: [
    {
      "field": "id",
      "width": 40,
      "checkboxSelection": true
    },
    {
      "headerName": "Title",
      "field": "docTitle",
      "width": 1580,
      "cellRenderer": "detailViewRenderer"
    }
 ]
}

Documentation

Answer 2

如果您仍在寻找答案，则可以使用rowNode.columnApi.resetColumnState()

ag-grid单元格渲染器，显示来自多列的数据

2 个答案: