【问题标题】:I want to set checkbox to true based on a condition in ag-grid我想根据 ag-grid 中的条件将复选框设置为 true
【发布时间】:2020-09-12 22:42:22
【问题描述】:

我有一个按钮,它基本上可以导入一些数据。需要将此导入的数据与已加载的 ag-grid 中的数据进行比较,如果匹配,则将该特定行节点的 cehckbox 设置为 true。

这是检查条件的按钮:

    enableCheck() {
    alert('works');
    if (this.DataService.isNotBlank(this.rowDataImport)) {
        for (let i = 0; i < this.rowDataImport.length; i++) {
            if (this.DataService.isNotBlank(this.rowData)) { 
                for (let j = 0; j < this.rowData.length; j++) { 
                    if (this.DataService.isNotBlank(this.rowData[j].calDate)) {
                        for (const calDates of this.rowData[j].calDate) {
                            if (
                            this.rowDataImport[i].isin === calDates.isin ||
                            this.rowDataImport[i].portfolioName === calDates.portfolioName ||
                            this.rowDataImport[i].valuationDate === calDates.valuationDate
                                ) 
                                {
                                     // alert('true')
                                    this.checkValue = true;
                                } else {
                                    this.checkValue = false;                                        
                                }
                        }
                    }
                }
            }
        }
      }

}

this.checkValue 是一个标志,如果找到匹配则为真。

  public gridColumnDefs = [
        {
            headerName: 'Portfolio Name',
            field: 'portfolioName',
            cellRenderer: 'agGroupCellRenderer',
            headerCheckboxSelection: true,
            headerCheckboxSelectionFilteredOnly: true,
            checkboxSelection: true,
            pinned: 'left',
            filter: true,
            cellRendererParams:(params) => {
                console.log(params);
                if (this.checkValue) {
                 params.node.selected = true;
                }
            }
        },
]

这里我使用了 cellRendererParams。但这仅适用于负载我猜。如果我想从外部的值(即上面给出的导入检查)更新 ag-grid 行该怎么办?

【问题讨论】:

  • 导入完成后您是否尝试过 api.refreshCells()?并添加您需要 else 条件来发送 params.node.selected = false
  • 是的,我尝试了 setRowData 方法。它没有工作

标签: checkbox angular7 ag-grid


【解决方案1】:

首先,你应该为defaultColDef中的每一行添加id

this.defaultColDef = {
  getRowNodeId: data => data.id,
};

然后就可以找到这个id,把checkbox设为true。

此外,您可以按名称查找单独的字段。 真的很简单,你应该使用下一个组合

  selectRow() {
    this.gridApi.forEachNode(node => {
        if (node.id == 1 || node.id == 2 || node.data.country == 'Australia') {
            node.setSelected(true);
        }
    });
  }

工作示例: https://plnkr.co/edit/ijgg6bXVleOAmNL8

在此示例中,当我们单击按钮时 - 我们将 ID 为 1 和 2 的两行以及国家/地区为“澳大利亚”的每个字段的复选框设置为 true

在您的情况下,您使用的配置不正确。

你应该cellRenderer

cellRenderer: params => {
  if(params.value === 'Ireland') {
    params.node.setSelected(true)
  }
  return params.value
},

再举一个例子:https://plnkr.co/edit/PcBklnJVT2NsNbm6?preview

【讨论】:

    【解决方案2】:

    我进行了一些操作,并做了下面的事情,这就像一个魅力。

     this.gridApi.forEachNode(node => {
                        if (node.data.isin === this.rowDataImport[i].isin &&
                                node.data.portfolioName === this.rowDataImport[i].portfolioName &&
                                node.data.valuationDate === this.rowDataImport[i].valuationDate
                        ) {
                            node.setSelected(true);
                        }
    

    【讨论】:

      猜你喜欢
      • 2020-09-08
      • 2019-07-16
      • 2018-09-20
      • 1970-01-01
      • 1970-01-01
      • 2019-05-23
      • 2020-11-02
      • 2015-05-19
      • 2018-05-25
      相关资源
      最近更新 更多