angular - 在订阅中更新 mat 表数据源

问题描述

我对 Angular 比较陌生，并且在我的打字稿中更新订阅中的 mat 表数据源（声明为数据源：any）时遇到了一些麻烦。

我下面的函数转到 adminservice 并进行 api 调用，然后该函数循环返回的数组并通过 adminservice 进行另一个 api 调用以获取有关车队的更多信息。

在我的代码的底部是更新数据源的原始方法，但没有额外的必需数据。这很好用，让我很困惑。

任何帮助将不胜感激。

refresh(): void {
    const data = {};
    const that = this;
    this.adminService.fleets(data).subscribe(result => {

      that.fleetTableData = [];

      result.forEach(function (fleetObject){

        if (typeof fleetObject.fleetTotals === 'undefined'){
          fleetObject.fleetTotals = {};
          fleetObject.fleetTotals.totalVehicles = 0;
          fleetObject.fleetTotals.totalActiveVehicles = 0;
          fleetObject.fleetTotals.totalStatusTestedVehicles = 0;
        }

        that.fleetTableData[fleetObject.fleetId] = fleetObject;

        that.adminService.vehicles(
          {fleetId: fleetObject.fleetId}
        ).subscribe(result2 => {

          result2.forEach(function (vehicleForFleet) {
            var fleetId = vehicleForFleet.fleetId;
            that.fleetTableData[fleetId].fleetTotals.totalVehicles = (that.fleetTableData[fleetId].fleetTotals.totalVehicles + 1);
            if (typeof vehicleForFleet.commissioning !== 'undefined') {
              if (vehicleForFleet.commissioning.commissionStatus === 'tested') {
                that.fleetTableData[fleetId].fleetTotals.totalStatusTestedVehicles = (that.fleetTableData[fleetId].fleetTotals.totalStatusTestedVehicles + 1);
              }
              if (vehicleForFleet.commissioning.commissionStatus === 'active') {
                that.fleetTableData[fleetId].fleetTotals.totalActiveVehicles = (that.fleetTableData[fleetId].fleetTotals.totalActiveVehicles + 1);
              }
            }
          });
        });
      });
      // in subscribe doesn't save to that.datasorce
      that.dataSource.data = new MatTableDataSource(that.fleetTableData);
      that.dataSource.sort = that.sort;
      console.log(that.fleetTableData);
    });
    //out subscribe doest work as it is returning undefined
    // console.log(this.fleetTableData);
    // this.dataSource = new MatTableDataSource(this.fleetTableData);
    // this.dataSource.sort = this.sort;


//works
    // const data = {};
    // this.adminService.fleets(data).subscribe(result => {
    //   this.fleets = result;
    //   this.dataSource = new MatTableDataSource(this.fleets);
    //   this.dataSource.sort = this.sort;
    //
    //   console.log(result);
    // });
  }

标签： angulartypescriptangular-material

angular - 在订阅中更新 mat 表数据源

问题描述

解决方案

推荐阅读