пейджинг на стороне сервера aggrid 'не может заставить сетку рисовать строки, когда она находится в середине строк рисования'

У меня есть такой агрессивный компонент:

  private gridOptions = {
    columnDefs: this.columnDefs,
    frameworkComponents: { buttonRenderer: ButtonRenderer},
    pagination: true, 
    paginationPageSize: 20,
    cacheBlockSize: 20,
    // server side paging
    rowModelType: 'infinite',
    datasource: this.dataSource
   };

  private dataSource: IDatasource = {
    getRows: (params: IGetRowsParams) => {
      var query = { startrow: params.startRow,
                    endrow: params.endRow,
                    company_name: this.companyName,
                    company_address: this.companyAddress,
                    company_capital: this.companyCapital
                  };
      this.http.post(environment.api_url + "/register/search",query).subscribe((results:any) => {
        params.successCallback(results.data, results.totalRecords);
        this.gridApi.refresh();
      });            
    }
  };

При первой загрузке agrid показывает нормально. Если я нажимаю следующую страницу, я получаю такую ​​ошибку:

ОШИБКА Ошибка: «ag-Grid: не удается заставить сетку рисовать строки, когда она находится в середине строк рисования. Ваш код, вероятно, вызвал метод API сетки, когда сетка находилась на этапе визуализации. Чтобы преодолеть это, поместите вызов API в тайм-аут, например, вместо api.refreshView () вызовите setTimeout (function () {api.refreshView (), 0}). Чтобы узнать, какая часть вашего кода вызвала обновление, проверьте эту трассировку стека. "

Есть ли какой-нибудь пример для ссылки? Я поискал, но все, кажется, справляются без этой проблемы.

Кстати: я использую angular 8, aggrid 22.1.1


angular ag-grid infinite
person Vincent Chen    schedule 17.03.2020    source источник
comment
Я предполагаю, что вам не следует вызывать метод refresh () сетки после вызова successCallback, который, вероятно, также запускает обновление. Если вам действительно нужно вызвать refresh (), попробуйте сделать это в setTimeout ()   -  person GreyBeardedGeek    schedule 18.03.2020
comment
Спасибо за Ваш ответ. Для меня это проблема valueFormatter. Если я удалю valueFormatter из определения столбца, все будет работать нормально. Когда я проверял хром-консоль, я обнаружил, что функция форматирования не определена для значения ячейки. Я не знаю, как это исправить, поэтому удаляю все valueFormatter. После этого все работает отлично.   -  person Vincent Chen    schedule 19.03.2020
comment
Один совет - я обнаружил, что функции, которые компонент предоставляет сетке (valueGetters, valueSetters, valueFormatters и т. Д.), Должны быть лямбдами (жирными стрелочными функциями), а не просто обычными методами компонента. Это связано с Lambda, а в обычном методе - нет.   -  person GreyBeardedGeek    schedule 19.03.2020
comment
У меня также есть эта проблема с agGrid 24.1, и мой код Angular не имеет никакого valueFormatter или вызовов refresh (). У меня есть основная сетка с двухуровневыми сетками детализации, и если я расширяю / сжимаю всего несколько строк, оставляя здоровую паузу между щелчками, я все равно получаю эту ошибку ... Я не знаю, почему.   -  person Mike Gledhill    schedule 02.12.2020

Ответы (1)


arrow_upward
4
arrow_downward

как указано в комментарии @Vincemt Chen

Спасибо за Ваш ответ. Для меня это проблема valueFormatter. Если я удалю valueFormatter из определения столбца, все будет работать нормально. Когда я проверял хром-консоль, я обнаружил, что функция форматирования не определена для значения ячейки. Я не знаю, как это исправить, поэтому я удаляю все valueFormatter. После этого все работает отлично.

Это случилось и со мной, поэтому вместо удаления valueFormatter, что было полезно, я добавил проверку, является ли params.value undefined. Например:

{
    headerName: "first cell",
    field: "first field",
    valueFormatter: (params) => {
        if(!params.value) return 'ERROR';

        ...your original code...
    }
}
person noam7700    schedule 09.11.2020