Estoy siguiendo un ejemplo (parámetros dinámicos: menú desplegable de la ciudad) del siguiente enlace y funciona bien cuando uso datos de matriz estática, pero cuando intento vincular la misma lista de datos de la API, no se vincula inicialmente. Es vinculante cuando edito el valor desplegable solo por segunda vez. Intenté hacer que la llamada a la API también fuera sincrónica, pero no funcionó. ¿Qué hice mal?

 https://www.ag-grid.com/javascript-data-grid/cell-editing/#example-dynamic-parameters

Angular- página Html,

 <div *ngIf="isLoaded"> <ag-grid-angular style="width: 1000px; height: 300px;" class="ag-theme-balham" [modules]="modules" [rowData]="rowData" [gridOptions]="gridOptions" (gridReady)="onGridReady($event)" ></ag-grid-angular> </div>

Mi campo desplegable dinámico ag-grid se basa en otro Id. de campo,

 { headerName: 'ScoreDescription', field: 'score', cellEditor: 'agRichSelectCellEditor', cellRenderer: scoreCellRenderer, cellEditorParams: cellCellEditorParams, sortable: true, filter: true, minWidth: 300 },

La función cellCellEditorParams es vincular la lista de puntajes dinámicamente desde la API,

 scoreList: any = []; ... ngOnInit(): void { const cellCellEditorParams = (params) => { this.kpiProjectService.getScoreDescriptionsByKpiId(params.data.kpiId).then((x)=>{ this.scoreList=x}); return { cellRenderer:scoreCellRenderer, values: this.scoreList, }; ​​... ... //gridOptions & some other functions, and then closing of ngOnInitFunction

mi servicio o llamada API,

 async getScoreDescriptionsByKpiId(id: number) { var ds = await this.http.get<any>(`${environment.services.kpiService.kpiscoresuri}/${id}`) .toPromise(); return ds; }