ag-grid - 如何在 Ag 网格中按行添加特定组件(如输入组件)，或者如何在 Ag 网格中按行删除组件？

Question

如何在特定行中添加特定组件(例如复选框、输入、选择、下拉组件)？每当我将一个组件添加到列中时，它就会出现在每一行中。如何从特定行中删除组件？

 this.columnDefs1 = [ 
    {
         headerName: "M1",
         field: "m1",
         width: 90,
         cellRendererFramework: InputComponent,
         controlData: {
             type: 'text'
         },
    },
]

this.rowData1 = [
    { 
        m1: "50",
    },
    { 
        m1: "30",
    },
    { 
        m1: "",
        //If I don't want input component in this row, how can I remove? 
        //I have tried by not giving m1
        //also but its coming in whole column or every row.
    },
    { 
        m1: "20",
    },
]

您可以在链接图像中看到以供引用，我不需要最后 4 个选择组件，但我需要将这些行留空:

Answer 1

您可以使用colDef.cellRendererSelector，它是一个根据行数据选择渲染器的函数

headerName: "M1",
field: "m1",
width: 90,
cellRendererSelector: function (params) { 
    if (params.data.m1) {
       return InputComponent;
    } else {
       return null;
    }
},
controlData: {
    type: 'text'
}

您可以在这里阅读更多相关信息 - https://www.ag-grid.com/javascript-grid-cell-rendering/#many-renderers-one-column