0
votes

I am using ag-grid table in angular and trying to change aerrow icon in this but its not working i have used below code but its not working

I am changing icon inside column definition

public columnDefs = [
    { 
      headerName: "Group",
      field: 'group',
      cellRenderer: 'agGroupCellRenderer',
      icons: {
          groupContracted: '<img src="https://raw.githubusercontent.com/ag-grid/ag-grid/master/grid-packages/ag-grid-docs/src/javascript-grid-icons/minus.png" style="height: 12px; width: 12px;padding-right: 2px"/>',
        },
 
    },
    { headerName: "Year", field: "year" , sortable: true},
    { headerName: "Country", field: "country" }
  ];

but this is not being reflected. i am referring to below documentation link

https://www.ag-grid.com/javascript-grid-icons/

Below is the stackblitz link https://stackblitz.com/edit/angular-ag-grid-tree-data-bbbcyb

2

2 Answers

1
votes

enter image description hereGive icons object to gridOptions it will work

public gridOptions = {
    rowSelection: 'multiple',
    groupSelectsChildren: true,
    groupSelectsFiltered: true,
    suppressAggFuncInHeader: true,
    suppressRowClickSelection: true,
     autoGroupColumnDef: {headerName: "Athlete", field: "athlete", width: 200,
        cellRenderer:'agGroupCellRenderer'
    },
    getNodeChildDetails: function getNodeChildDetails(rowItem) {
      if (rowItem.participants) {
        return {
          group: true,
          // open C be default
          expanded: rowItem.group === 'Group C',
          // provide ag-Grid with the children of this group
          children: rowItem.participants,
          // the key is used by the default group cellRenderer
          key: rowItem.group
        };
      } else {
        return null;
      }
    },
    onGridReady: function (params) {
    },
    icons: {
      groupContracted: '<img src="https://raw.githubusercontent.com/ag-grid/ag-grid/master/grid-packages/ag-grid-docs/src/javascript-grid-icons/minus.png" style="height: 12px; width: 12px;padding-right: 2px"/>',
    }
  };
0
votes

Try to download the img file and use it as a local asset