【问题标题】:AG-GRID : Infinite loop between onRowSelected and setSelectedAG-GRID : onRowSelected 和 setSelected 之间的无限循环
【发布时间】:2020-06-25 09:11:22
【问题描述】:

我正在尝试根据我选择或取消选择一行来选择一些行,如果我选择一行,则索引低于所选行索引的行也会被选中。 我遇到的问题是,每次执行 setSelected(true) 或 setSelected(false) 时,都会再次触发 onRowSelected 事件,并变成无限循环。

this.gridOptions.onRowSelected = function(event) {
    var rowIndexSelected = event.rowIndex;
    if (event.node.selected) {
        vm.gridOptionsSuiviPrestataire.api.forEachNode(function(rowNode, index) {
            if (index < rowIndexSelected) {
                rowNode.setSelected(true);
            }
        });             
    } else {
        vm.gridOptionsSuiviPrestataire.api.forEachNode(function(rowNode, index) {
            if (index > rowIndexSelected) {
                rowNode.setSelected(true);
            }
        }); 
    }
};

有没有办法在不触发 onRowSelected 事件侦听器或使用某些标志来阻止执行方法内部的代码的情况下做到这一点?

【问题讨论】:

  • 而不是使用onRowSelected,捕获rowClicked 并在那里实现你的逻辑。否则会发生这种情况。
  • 我已经使用 rowClicked 来显示一个弹出窗口,所以我不能在 rowClicked 上做这两件事。我想在复选框的选择上做到这一点。

标签: javascript angularjs ag-grid ag-grid-angular


【解决方案1】:

node.setSelected 有第三个参数称为suppressFinishActions,但目前它只抑制onSelectionChanged 事件。这是 ag-Grid 在 backlog 中有两个项目(AG-2859 和 AG-2707)的限制。我不确定他们什么时候会提供修复。

现在您可以尝试使用node.selected = true,但我注意到以这种方式选择的行没有通过手动选择或setSelected 添加的突出显示。

【讨论】:

    【解决方案2】:

    希望这会对你有所帮助。

    let rowSelected = false;
    
    this.gridOptions.onRowSelected = function (event) {
    
      if (rowSelected) {
        return;
      }
    
      var rowIndexSelected = event.rowIndex;
      if (event.node.selected) {
        vm.gridOptions.api.forEachNode(function (rowNode, index) {
          if (index < rowIndexSelected) {
            rowSelected = true;
            rowNode.setSelected(true);
    
          }
        });
      } else {
        vm.gridOptions.api.forEachNode(function (rowNode, index) {
          if (index > rowIndexSelected) {
            rowSelected = true;
            rowNode.setSelected(true);
          }
        });
      }
    
      rowSelected = false;
    };
    

    【讨论】:

      猜你喜欢
      • 2020-11-05
      • 2020-04-07
      • 1970-01-01
      • 2019-02-18
      • 2019-03-30
      • 2018-03-10
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多