Когда серверная сторона сортирует столбец в ag-сетке, он запускает запрос с первой страницы - PullRequest
0 голосов
/ 08 мая 2020
• 1000 не уверен, что я делаю здесь неправильно: -

Разбивка на страницы работает нормально, только когда я применяю модель сортировки.

Это метод в моем классе компонентов angular для создания источник данных. Я объединяю свои другие параметры с параметром aggrid params.request для вызова API: -

createDatasource(data: ActiveFiltersWithParams): Observable<IServerSideDatasource> {
    const dataSource: IServerSideDatasource = {
      // called by the grid when more rows are required
      getRows: (params: IServerSideGetRowsParams) => {
        data.startRow = params.request.startRow + 1;
        data.endRow = params.request.endRow;
        data.sortModel = params.request.sortModel;
        var response = this.getGridData(data);
        response
          .pipe(takeUntil(this.unsubscribe$))
          .subscribe(data => {
            const immutableData: FundDetail = JSON.parse(JSON.stringify(data));
            setTimeout(() => {
              let lastRow = -1;
              if (immutableData.totalRows <= params.request.endRow) {
                lastRow = immutableData.totalRows;
              }
              if (immutableData.rows.length === 0) {
                this.gridOptions.api.showNoRowsOverlay()
              }
              params.successCallback(immutableData.rows, lastRow);
            }), 500
          }, (err) => {
            params.failCallback();
            this.toastrService.error(err);
          });
      }
    };
    if (this.gridApi)
      this.gridApi.setServerSideDatasource(dataSource);
    return Observable.of(dataSource);
  }

здесь я вызываю свою функцию createDataSouce: -

this.etpScreenerService.activeFiltersForGridObs$
      .pipe(switchMap((data) => {
        if (data && Object.keys(data).length) {
          if (this.gridOptions && this.gridOptions.api)
            this.gridOptions.api.hideOverlay();
          return this.createDatasource(data);
        } else {
          return Observable.empty();
        }
      }), takeUntil(this.unsubscribe$))
      .subscribe((data) => {

      }, err => {
        this.toastrService.error(err);
      });

это Объект GridOptions: -

gridOptions: GridOptions = {
    // pagination: true,
    rowModelType: 'serverSide',
    cacheBlockSize: 20,
    columnDefs: this.createColumnDefs(),
    components: {
      loadingCellRenderer: (params: any) => {
        if (params.value !== undefined) {
          return params.value;
        } else {
          return `<i class="fa fa-spinner fa-pulse fa-fw"></i><span>Loading...</span>`;
        }
      }
    },

  };

И в моем шаблоне я использую несколько таких параметров: -

<ag-grid-angular style="height: calc(100vh - 160px);" class="ag-theme-balham" [animateRows]="true"
            [enableServerSideSorting]="true" [overlayLoadingTemplate]="overlayLoadingTemplate" [overlayNoRowsTemplate]="overlayNoRowsTemplate" [enableColResize]="true" [gridOptions]="gridOptions"
            (gridReady)="onGridReady($event)"></ag-grid-angular>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...