Dynami c Конфигурация колонки в ag-grid

Question

Я пытаюсь динамически загружать данные таблицы в ag-grid. Все столбцы будут перечислены в флажках боковой панели (ToolPanel), и если пользователь щелкнет по любому не отмеченному полю, запрос будет отправлен на сервер и получит данные для этого столбца и объединится в сетку.

Я не уверен, что это можно сделать с помощью боковой панели ag-grid. Я думаю о захвате события click в sideBar, но не могу найти никакого соответствующего документа.

Пожалуйста, дайте мне знать, если есть какое-либо решение для этого.

Answer 1

Если вы ожидаете какого-либо события от ag-grid , я думаю, columnVisible может вам помочь.

Посмотрите на этот пример в реальном времени: https://plnkr.co/edit/KpFQp84rZvJgY2gjKRar?p=preview
Снимите отметку с любого столбца, а затем проверьте.

<AgGridReact
   ...
   onColumnVisible={this.onColumnVisible}
/>

  onColumnVisible = params => {
    console.log(params);
    if (params.visible) {
      const colId = params.column.colId;
      alert(colId);
      // you could identify here, which column was checked
      // load data from server for that column
      // make sure you also retrieve ID and then associate the column data with appropriate row, i.e.
     this.yourHttpSvc.getColData(colId).subscribe(response => {
        // iterate through response & rowData appropriately
        this.stats.rowData[key][colId] = response[key][colId];
     })
    }
  }

Надеюсь, это поможет!