Can you specify a different customCellRenderer to different rows in ag-grid Angular

谁说胖子不能爱 提交于 2019-12-13 04:09:50

问题


I have built this simple grid:

The user chooses an option from List 1 in ParenColumn.
Depending on which option he chose, different lists will be displayed in column 2. For example, if he chooses option3 then list 3 will be displayed in the second column in the corresponding row.
The problem is: Since the customCellRenderer in column two is applied to all the rows then The same list will be shown in All the rows as you see in the picture.
My question is: Is it possible to "give" each row its own cellRenderer?
Here's ChildColumn Definition:

 {
          headerName: "ChildColumn",
          field: "chdCol",
          cellRenderer:  (params) => {
            return(
                   `       <select class="form-control">
                <br>`
                +`<option>` +
                this.receivedChosenOptionfromCol1[0]
                +`</option>`
                +`<option>` +
                this.receivedChosenOptionfromCol1[1]
                +`</option>` +
                `<option>` +
                this.receivedChosenOptionfromCol1[2]
                +`</option>` +
                `<option>` +
                this.receivedChosenOptionfromCol1[3]
                +`</option>` +
              `</select>
            `)
          } 

To see the whole code I used to implement this grid and its functionality, please check-out this StackOverflow code where I answered my own question:
How to refresh a column B in ag-grid based on a change that occured in another column A

Thanks :)


回答1:


You can do the following

      cellRenderer:  this.getCellRenderer

Then define the getCellRenderer function

function getCellRenderer(params) {
    // Check condition to render renderer 1 or 2
    // Replace condition
    if (true) {
        return "<h1> Component 1 </h1>"
    } else {
        return "<h1> Component 2 </h1>"
    }
}

Giving the cell renderer a function makes it dynamic as it will be called every time the grid values are changed.



来源:https://stackoverflow.com/questions/56074232/can-you-specify-a-different-customcellrenderer-to-different-rows-in-ag-grid-angu

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!