Question

我真正希望学习的是ag-Grid是否会触发一个（checkboxClicked）事件，并像（rowClicked）一样为您提供节点数据，否则我将如何实现这种事情。

这是我的问题的描述：现在，我在网格的每一行上都有复选框。用户需要能够单击行或复选框来激发函数，以便访问网格背后的数据，但是如果我们在单击复选框时使用（rowClicked），则此事件不会激发...所以我看了看使用（rowSelected），但当网格准备就绪时，它将在我们为该网格建立选择状态时开始触发。是否有一个checkboxClicked事件或其他东西使我不必自定义它？

到目前为止，我已经这样做来解决我的问题...正如您看到的那样，当我将复选框设置为选中状态并触发映射功能时，问题才出现。因此，在这些构建函数启动后的头500毫秒内，我将其关闭。

感谢您提供的任何帮助！谢谢

组件：

  buildSelectionStateFromId() {
    this.buildSelectionStateFromIdIsRunning = true;
    // we will have to loop over userIds array and select all the org admins
    // input = orgVM.orgInfo.userIds && orgVM.orgInfo.
    const admins = this.orgVM.orgAdmins;
    this.agGrid.api.forEachNode(function (node) {
      console.log('node: ', node);
      admins.map(x => {
        console.log('x: ', x);
        if (node.data.id === x.id) {
          console.log('node.data.id: ', node.data.id);
          node.setSelected(true);
        }
      });
    });
    // output = actually checking the box based on the security ids in currentUser

    this.buildingSelection();
  }


  toggleOnlySelectedRows(data) {
    this.buildSelectionStateFromIdIsRunning = true;
    this.toggleSelected = !this.toggleSelected;
    console.log('this.toggleSelected: ', this.toggleSelected);
    if (this.toggleSelected) {
      let selectedRows;
      const clone = [...(<any>this.agGrid.rowData)];
      selectedRows = clone.filter((el) => this.getSelectedRows().includes(el));
      this.agGrid.api.setRowData(selectedRows);
      console.log('selectedRows: ', selectedRows);
      this.buildSelectionStateFromId();
    } else {
      console.log('data: ', data);
      this.agGrid.api.setRowData(data);
      this.buildSelectionStateFromId();
    }
    this.buildingSelection();
  }

  buildingSelection() {
    setTimeout(() => {
      this.buildSelectionStateFromIdIsRunning = false;
    }, 500);
  }

  mapClickToModel(rowClicked) {
    console.log('rowClicked: ', rowClicked);
    // *ag-Grid hint: if we use (rowSelected), it will start firing when we are building
    // * our selection through any automated way like buildSelectionStateFromId();
    // * if we use (rowClicked) when we click the checkbox mapClickToModel wont fire...
    // * Another solution might be to not use their checkbox and just put our checkbox in a cell renderer?
    // TODO: refactor this timing hack
    if (this.buildSelectionStateFromIdIsRunning === false) {
      // console.log('this.buildSelectionStateFromIdIsRunning: mpa click to model fired');

      this.orgVM.orgUsers.map(x => {
        // whenever a row is clicked I grab the id off it and see if it is equal to any on the orgUsers array
        if (x.id === rowClicked.node.data.id) {
          console.log('x.id: ', x.id);
          // if it is then i check if the usertype is 1
          if (x.userType === 1) {
            // if it is then I change it to something else
            x.userType = 0; // ! what do we change it to?
          } else {
            x.userType = 1;
          }
        }
      });

    }

  }

模板：

<ag-grid-angular #agGrid (componentStateChanged)="onGridReady($event)"
      (rowSelected)="mapClickToModel($event)" (click)="mapClickToModel($event)"
      (gridReady)="onGridReady($event)" style="width: 100%; height: 84%;"
      class="of-grid-theme" rowMultiSelectWithClick="true"
      [context]="context" [frameworkComponents]="frameworkComponents"
      [headerHeight]="headerHeight" [getContextMenuItems]="getContextMenuItems"
      [enableSorting]="true" [enableFilter]="true" [multiSortKey]="multiSortKey"
      [defaultColDef]="defaultColDef" [rowData]="rowData" [columnDefs]="columnDefs"
      rowSelection="multiple" pagination="true" paginationAutoPageSize="true"
      animateRows="true" [defaultColDef]="defaultColDef">
    </ag-grid-angular>

我想到的一个更好的解决方案是：我可以将mapClickToModel参数设为可选参数并将其触发单击（单击），然后检查它是否未定义；如果未定义，则检查thennnn。我访问getSelectedRows（）并以这种方式获取节点数据。...但是我真的只是想看看是否可以得到一个事件，该事件使我刚刚选择的节点。

ag-Grid是否有（checkboxClicked）事件？

0 个答案: