Средство визуализации ячеек Ag Grid не создается до тех пор, пока не будет прокручено обратно в поле зрения

Я заметил странное поведение при использовании ag-grid с бесконечной прокруткой и рендерерами ячеек. Когда данные получены из источника данных, средства визуализации ячеек не создаются. При прокрутке вниз до тех пор, пока строка не исчезнет из поля зрения, и при прокрутке обратно вверх создаются экземпляры средств визуализации ячеек. Я бы предположил, что рендеры ячеек создаются немедленно при загрузке строки, обнаружил ли я ошибку или что-то упустил?

В настоящее время я использую версию сообщества ag-grid для отображения коллекции только для чтения. Эти данные поступают с сервера, который выполняет поиск и фильтрацию. Я использую Angular 5.2.0 с ag-grid 18.0.1 и ag-grid-angular 18.0.1. Это поведение также проявилось в ag-grid версии 17.10.0.

Я пробовал как cellRenderer: Function (Params), так и AgRendererComponent и ICellRendererAngularComp. Все они вызывают agInit (Params) только при прокрутке назад к строке.

Итак, это ошибка или предполагаемое поведение, если это ошибка, есть ли известное решение? Спасибо за ваше время, вот мой код:

Компонент, который получает ответ на вопрос из предоставленной карты («поле» в определении столбца - это идентификатор вопроса)

import { Component, ViewContainerRef } from '@angular/core';
import { AgRendererComponent } from 'ag-grid-angular';

@Component({
    selector: 'editor-cell',
    templateUrl: './answer.component.html'
})
export class AnswerComponent implements AgRendererComponent {

    private answer: any;

    private getAnswer(params: any): string {
        if(params.data == null){
        return;
        }
        if(params.data.answers == null){
            return;
        }
        return params.data.answers[params.colDef.field]
    }

    agInit(params:any):void {
        this.answer = this.getAnswer(params);
        if(this.answer != null){
            console.log("Set on init", this.answer);
        }
    }

    refresh(params:any):boolean {
        this.answer = this.getAnswer(params);
        if(this.answer != null){
            console.log("Set on refresh", this.answer);
        }
        return true;
    }
}

Вот мои определения столбцов: (Примечание: средства визуализации, не относящиеся к ячейкам, появляются сразу, только функция cellRenderer и cellRendererFramework не загружаются сразу.

{
                headerName: 'messages sent',
                field: 'sentMessages',
                suppressFilter: true
            },
            {
                headerName: 'work experience',
                field: '57ceb64efb6b510b857e8a25',
                cellRenderer: function(params){
                    return params.value;
                    if(params.node == null){
                        return ''
                    }
                    if(params.node.data == null){
                        return ''
                    }
                    if(params.node.data.answers == null){
                        return ''
                    }
                    if(params.node.data.answers[params.colDef.field] == null){
                        return ''
                    }
                    return params.node.data.answers[params.colDef.field].nl;
                }
            },
            {
                headerName: 'education',
                field: '57ceb64efb6b510b857e8a26',
                cellRendererFramework: AnswerComponent
            },
            {
                headerName: 'job title',
                field: '5a941e258bdfc300143cf6b0',
                cellRendererFramework: AnswerComponent
            }

Источник данных

this.datasource = {
    rowCount: null,
    getRows: function(params) {
        ts.query({
            page: Math.floor(params.startRow / 100),
            size: 100,
            filter: JSON.stringify(params.filterModel)
        }).subscribe(
            (res: HttpResponse<any[]>) => {
                let data = res.body;
                let lastRow = -1;
                if (data.length <= params.endRow) {
                    lastRow = data.length;
                }
                params.successCallback(data, -1);
            },
            (res: HttpErrorResponse) => console.log(res.message));
    }
};
this.rowSelection = "multiple";
this.rowModelType = "infinite";
this.maxBlocksInCache = 2;
this.infiniteInitialRowCount = 200;
this.maxConcurrentDatasourceRequests = 2;

Компонент HTML

<div>
    <ag-grid-angular
        #agGrid
        style="width: 100%; height: 500px;"
        id="myGrid"
        [rowData]="rowData"
        class="ag-theme-balham"
        [columnDefs]="columnDefs"
        [datasource]="datasource"
        [rowModelType]="rowModelType"
        [maxBlocksInCache]="maxBlocksInCache"
        [infiniteInitialRowCount]="infiniteInitialRowCount"
        [maxConcurrentDatasourceRequests]="maxConcurrentDatasourceRequests"
        [enableServerSideFilter]="true"
        [floatingFilter]="true"
        (gridReady)="onGridReady($event)"
        [newRowsAction]="keep"
    ></ag-grid-angular>
</div>