Question

我试图在angular7中使用ag-grid，我的代码如下所示：


    import { Component, OnInit } from '@angular/core';
    import { HttpClient, HttpHeaders } from '@angular/common/http';

    import { AgGridModule} from 'ag-grid-angular';

    @Component({
      selector: 'app-top100sp',
      templateUrl: './top100sp.component.html',
      styleUrls: ['./top100sp.component.css']
    })
    export class Top100spComponent implements OnInit {


      private top100url = 'http://resturl';

      private gridOptions;
      private row_per_page = 20;

      private endpoint;
      private rowData;
      private restDatasource;

      private columnDefs = [
        .
        .
        .
      ];

      constructor(private http: HttpClient) { }

      ngOnInit() {
          this.gridOptions = {
              columnDefs: this.columnDefs,
              rowModelType: 'infinite',
              //datasource: this.restDatasource,
              enableServerSideFilter: false,
              enableServerSideSorting: false,
              pagination: true, 
              paginationPageSize: this.row_per_page
         };
      }

      gridReady($event) {
          console.log("onGridReady "+$event.api.paginationGetPageSize());
          this.restDatasource = {
              rowCount: null,
              getRows: function(params) {
                  console.log(params.startRow + " to " + params.endRow);
                  this.endpoint = this.top100url + "/"+ params.startRow +"/" + params.endRow;
                  this.http.get(this.endpoint).subscribe((results) => {
                      //console.log(results);
                      //this.rowData = results;
                        params.successCallback(results, 20);
                  });
              }   
          };  
          $event.api.setDatasource(this.restDatasource);
      };

    }

页面初始化后，在JavaScript控制台中出现以下错误。

错误TypeError：“ this.http未定义”

为什么this.http是未定义的？我通过构造函数注入它。

我对Angular UI Grid很有经验，Angular 7是否有类似的解决方案？

Answer 1

使用箭头功能定义getRows方法。

getRows = (params) => {
     console.log(params.startRow + " to " + params.endRow);
     this.endpoint = this.top100url + "/"+ params.startRow +"/" + params.endRow;

     this.http.get(this.endpoint).subscribe((results) => {
        //console.log(results);
        //this.rowData = results;
        params.successCallback(results, 20);
     });
 }

angular7 ag-grid this.http是未定义错误

1 个答案: