setRowData 在第一次调用时不起作用 Angular 6

Question

我有一个 ag-grid，它有用于更改每行数据的按钮。当我单击该按钮时，它应该会在 bootstrap 模态中显示另一个 ag-grid；但问题是当网格第一次加载时，它没有显示任何数据，如它所说 "No Rows To Show"。当我第二次点击时，它显示网格数据。

这是我的代码：

OnGridReady(params){
      this.gridApi = params.api;
      this.loadQuestions();
      this.gridApi.setRowData(this.Questions);
     }

因为你想了解更多 loadQuestion()

private loadQuestion(){
    this.managementService.getQuestions().subscribe(
        (_q: Question[]) => {
             this.Questions = _q;
        },(err){ blah blah }    
    );

你能说出问题出在哪里吗？

Answer 1

在你的 loadQuestion 中做 setRowData。

private loadQuestion(): void => {
   this.managementService.getQuestions().subscribe(
      (_q: Question[]) => {
         this.Questions = _q;
          this.gridApi.setRowData(this.Questions);
      },(err){ blah blah }    
);

我认为您遇到的问题是由于您 setRowData 时 this.Questions 的数据不可用。

下次加载时，它会在那里。

更新

当您按照问题中的内容定义函数时，您可能会遇到以下错误。

"Cannot read property 'setRowData' of undefined".

您可以按照此答案中显示的代码，使用箭头函数获取函数内部可用的外部作用域。

有关 Arrow function

的更多详细信息，请参阅 link

Lovingly called the fat arrow (because -> is a thin arrow and => is a fat arrow) and also called a lambda function (because of other languages). Another commonly used feature is the fat arrow function ()=>something. The motivation for a fat arrow is: You don't need to

Keep typing function

It lexically captures the meaning of this

It lexically captures the meaning of arguments

Answer 2

我在Angular中进一步调查，发现这种调用服务的类型是Async，显示"Cannot read property 'setRowData'"是正常的，因为数据没有加载完全。我只是这样做：

private loadQuestion() {
    this.Questions = [];
    this.managementService.getQuestions().subscribe(
         _q => {
             _q.forEach(element => {
                 this.Questions.push(element);
             });
             this.gridApi.setRowData(this.Questions);
         },(err){ blah blah }    
);

setRowData 在第一次调用时不起作用 Angular 6

setRowData Not Work on First Call Angular 6

ag-grid

angular

更新