Question

我的网格中某些行应触发fullRow编辑，因为大多数数据为空。一些列也应该是必填列。有没有一种方法可以使某些行（基于rowNode数据）完全可编辑，同时保持其他行的单元格编辑模式呢？

谢谢

Answer 1

你可以很容易地做到这一点（我花了 15 分钟）。

在您的 onCellClicked($event) 方法中设置一个模块级变量，针对哪个列被点击。

例如：

  onCellClicked($event) {
      this.fullRowEditOnlyPopup = $event.colDef.field;

      if (this.editingRowIndex !== $event.rowIndex) {
        $event.api.startEditingCell({
          rowIndex: $event.rowIndex,
          colKey: $event.column.colId
        });
        this.editingRowIndex = $event.rowIndex;
      }
  }

我有一列带有一个按钮，该按钮会弹出一个 ICellEditorAngularComp 'cdTargetLabourDetailRenderer'，该按钮在调用时应该是该行中唯一可编辑的项目：

this.columnDefs.push({
  headerName: '',
  field: 'popupEditColumn',
  cellStyle: { 'text-align': 'left' },
  cellEditor: 'cdTargetLabourDetailRenderer',
  cellRendererParams: { buttonType: 'settings' },
  cellRendererFramework: MatButtonComponent,

  cellEditorParams: (params) => {
    return {
      resource: this.getTargetResource(params)
    };
  },
  onCellValueChanged: (params: any) => {
    if (params.node && params.node.data && params.node.data.resource) {
      params.data.resource = params.node.data.resource;
      params.data.description = params.node.data.resource.description;
      this.gridApi.updateRowData(params.node.data);
    }

    this.gridApi.refreshCells();
  },
  editable: (params) => {
    return (this.fullRowEditOnlyPopup === 'popupEditColumn');
  },
});

我有 12 列，我想在全行模式下进行编辑，并根据是否单击弹出编辑列或其他列（包括 12 个月列中的任何列）来返回是否可编辑：

this.months.forEach((month: any) => {
  this.columnDefs.push({
    headerName: this.datePipe.transform(month, 'MMM yy'),
    field: this.datePipe.transform(month, 'MMMyy'),
    type: 'numericColumn',
    cellStyle: {
      'text-align': 'right',
    },
    valueFormatter: this.labourFormatter,
    editable: (params) => {
      let editable = false;
      if (this.fullRowEditOnlyPopup === 'popupEditColumn') { return false; }

      // Perform other logic if needed for month columns
      if (!doingStuffAndThings) {
        editable = false;
      } else {
        editable = true;
      }

      return editable;
    },
  });
});

如果我点击 'popupEditorColumn'，只显示 ICellEditorAngularComp。如果我点击任何其他行，则月份列的整行编辑显示为可编辑。

然而，有一个烦人的需要双击单元格进入编辑模式，在这种模式下，最初只需要单击一次。

ag-grid：基于rowNode内容在fullRow编辑和单单元格编辑之间切换

1 个答案: