如何实现查找列值并在 ag 网格中替换为新值（如查找和替换）

Question

我是 ag-grid 角度的新手。我想实现一个功能，我可以在其中找到每一列的值并用单列中的新值替换。

Answer 1

由于 ag-grid 不提供查找/替换的方法，您可以使用以下算法来完成。

foundCell = [];
        foundIndex = 0;
        message = '';
        //Find text in ag-grid
        find(findText: string) {
            let found = false;
            let rowNodes: any = [];
            let focusedCell = this.gridApi.getFocusedCell();
            if (focusedCell) {
              let lastFoundObj: any;
              if (this.foundCell.length > 0) {
                lastFoundObj = this.foundCell[this.foundCell.length - 1];
                if (!(lastFoundObj.rowIndex == focusedCell.rowIndex && lastFoundObj.field == focusedCell.column.colId)) {
                  this.foundCell = [];
                  this.foundIndex = focusedCell.rowIndex;
                }
              }
            }
            this.gridApi.forEachNode(function (node,rowIndex) {
                  rowNodes.push(node);
            });
            for(let i=this.foundIndex; i < rowColumnData.rowNodes.length ; i++) {
              let node = rowColumnData.rowNodes[i];
              var rowObj = node.data;
              found = false;
              for (var key in rowObj) {
                if (rowObj[key].includes(findText) && !this.checkIfAlreadyFound(key, node.rowIndex)) {
                  found = true;
                  this.foundCell.push({ 'field': key, 'rowIndex': node.rowIndex});
                  break;
                }
              }
              if (found) {
                break;
              }
            }
            if (found) {
              let lastFoundCell = this.foundCell[this.foundCell.length-1];
              this.gridApi.ensureIndexVisible(lastFoundCell.rowIndex, 'middle');
              this.gridApi.ensureColumnVisible(lastFoundCell.field);
              this.gridApi.setFocusedCell(lastFoundCell.rowIndex,lastFoundCell.field);
              this.found = true;
            } else {
              this.foundIndex = 0;
              this.foundCell = [];
              this.found = false;
              this.message = 'Not found';
            }
        }
        
        
        //Replace text in ag-grid
        replace(findText: string, replaceWith: string, isReplaceAll: boolean) {
            if (this.found || isReplaceAll) {
              let focusedCell: any;
              var cell: any;
              let rowNodes = [];
              focusedCell = this.gridApi.getFocusedCell();
              if (focusedCell) {
                cell = { rowIndex: focusedCell.rowIndex, field: focusedCell.column.colId };
              } else {
                cell = this.foundCell[this.foundCell.length - 1];
              }
              this.gridApi.forEachNode(function (node,rowIndex) {
                  rowNodes.push(node);
              });
              var rowNode: any;
              var newCellValue: any;
              if (isReplaceAll) {
                let allfoundCell = this.findAllCells(rowNodes,findText);
                for (var i = 0; i < allfoundCell.length; i++) {
                  cell = allfoundCell[i];
                  rowNode = gridApi.getDisplayedRowAtIndex(cell.rowIndex);
                  newCellValue = this.gridApi.getValue(cell.field, rowNode).replace(findText,replaceWith);
                  rowNode.setDataValue(cell.field, newCellValue);
                }
              } else {
                rowNode = this.gridApi.getDisplayedRowAtIndex(cell.rowIndex);
                newCellValue = this.gridApi.getValue(cell.field, rowNode).replace(findText,replaceWith);
                if (newCellValue != rowNode.data[cell.field]) {
                  rowNode.setDataValue(cell.field, newCellValue);
                } 
              }
              this.found = false;
            }
         }