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

问题描述 投票:0回答:1

我尝试在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的类似解决方案?

angular angular7 ag-grid
1个回答
0
投票

使用箭头函数定义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);
     });
 }   
© www.soinside.com 2019 - 2024. All rights reserved.