Я создал кнопку, чтобы развернуть все строки в ag-grid (Enterprise), имеющие 150 строк в сетке. В Chrome он работает нормально, но в последних версиях FF и Edge отображается предупреждение о том, что веб-страница замедляет работу вашего браузера. Есть ли лучший подход, чтобы расширить все строки? Это занимает почти 10-15 секунд

Html

<button (click)="expandAll(expand)">Expand/Collapse</button>  

Javascript

this.columnDefs = [
           {
                headerName: "",
                field: "",
                cellRenderer: "group",// for rendering cell
                suppressMenu: true,
                suppressSorting: true
            }
           ]
           // This is how I am creating fullrow width
            this.gridOptions = <GridOptions>{
            isFullWidthCell: function (rowNode) {
            var rowIsNestedRow = rowNode.flower;
            return rowIsNestedRow;
            },
            fullWidthCellRendererFramework: AgGridInventorRowComponent,
            doesDataFlower: function (dataItem) {
            return true;
         }
    public expandAll(value:boolean) {
            if(value) {
                this.gridOptions.api.forEachNode((node) =>{
                    node.setExpanded(true);
                });
            } else {
                this.gridOptions.api.forEachNode((node) =>{
                    node.setExpanded(false);
                });
            }
        }

enter image description here

6
DirtyMind 30 Авг 2017 в 22:26

3 ответа

Лучший ответ

Согласно документации:

Вызов node.setExpanded () приводит к перерисовке сетки. Если у вас есть много узлов, которые вы хотите расширить, то лучше установить напрямую node.expanded = true, а затем вызвать api.onGroupExpandedOrCollapsed (), чтобы заставить сетку снова перерисовывать сетку только один раз.

Поэтому я изменил свой код, как показано ниже:

this.gridOptions.api.forEachNode(node => {
  node.expanded = true;
});
this.gridOptions.api.onGroupExpandedOrCollapsed();

страница Ag-gridDocumentation внутри группы API

5
Eliran Malka 11 Фев 2020 в 01:45

API имеет expandAll и collapseAll:

api.expandAll();
api.collapseAll();

Обратите внимание, что из-за дрянной архитектуры AG Grid состояние расширения (наряду с выбором строки и т. Д.) Теряется, если данные строки изменяются или сетка перемонтируется / перерисовывается. Вы должны использовать deltaRowDataMode, но убедитесь, что вы даете своим строкам уникальный идентификатор, чтобы помочь предотвратить это (хотя эта опция, конечно, может вызвать некоторые трудные для отладки ошибки, о которых я сообщал).

Также, если вы хотите восстановить расширение пользователя в этом случае, у вас нет выбора, кроме как перебирать и развертывать / сворачивать отдельные узлы.

Кроме того, они, кажется, не работают на сетке master-detail (функция предприятия) ...

3
Dominic 24 Июл 2019 в 11:32

Полагаю, вы используете строку возможность группировки, и вы имели в виду, что имеется 150 сгруппированных строк, которые можно развернуть.

В настоящее время ваш код выполняется для каждой строки данных, а не только для тех, которые могут быть расширены. Итак, предположим, что в каждой группе около 50 строк данных, и вы вызываете функцию setExpanded 7500 раз. Вы можете ограничить это простым вызовом setExpanded в сгруппированных строках, установив проверку перед вызовом setExpanded:

public expandAll(value:boolean) {
    this.gridOptions.api.forEachNode((node) =>{
        if (node.group)
            node.setExpanded(value);
    });
}

Тестирование в этом примере заняло примерно 2 секунды в течение 110 группы строк и 5 секунд для 511 групп строк в Firefox

6
Jarod Moser 31 Авг 2017 в 15:17