Ag-grid рендеринг ячеек, который показывает данные из нескольких столбцов

Question

Я пытаюсь создать средство визуализации ячеек, которое будет принимать данные из других столбцов.

Например, каждая строка обозначает некоторый фрагмент данных, и пользователи должны иметь возможность открывать его в зависимости от своих разрешений,и ограниченный фрагмент данных должен отображаться иначе, чем неограниченный элемент.Другие столбцы также будут влиять на визуализацию этого одного столбца.

Я ожидаю, что смогу получить доступ к данным других столбцов, используя путь this.params.node.data.restricted, и это работает во время события щелчка, но яКажется, я не могу получить доступ к этим данным на этапе рендеринга компонента.

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

В идеале я хотел бы установить столбцы, которые будут переданы вмой рендерер и доступ к ним в компоненте как-то по параметрам.Это возможно, или у нас есть какой-то другой обходной путь?Я вижу строки полной ширины в качестве опции, но при этом вся строка отображается как один столбец.

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"
    }
 ]
}

Документация