Mean Stack Data Aggregation, Not Displaying on Angular-CodePudding

I am using the mean stack and im aggregating data in the db to display on the front end. I am counting all the records of a db collection and returning a number to be displayed.

However i am not getting it to work on the angular frontend:

The controller and router for the aggregation: Route:

router.get('/DAFacilityCntRpts', DAFacilityController.DAFacility_count_reports)

Controller:

exports.DAFacility_count_reports = (req, res) => {
  DAFacility.aggregate([
    {
      '$project': {
        'eventName': 1, 
        'reportStatus': 1
      }
    }, {
      '$count': 'NoOfDaFacilityReports'
    }
  ]).then((DAFacility) => {
    res.send(DAFacility);
  })
  .catch((e) => {
    res.send(e);
  });
};

and it returns this on postman:

[
    {
        "NoOfDaFacilityReports": 4
    }
]

However when trying to get that value to be displayed on the front end it doesnt. services:

noOfDAFacReports() {
    return this._http.get("http://localhost:3000/DAFacilityCntRpts")
    .pipe(map((res:any)=>{
      return res;
    }))
  }

component.ts:

ngOnInit(): void {
    })
    console.log(this.aggregationFac)*/

    this.aggregation.noOfDAFacReports().subscribe(res=>
      {
        this.aggregationFac = res;
      })
  }

component.html:

<h3>Number of Facility Damage Assessment Reports Made: {{aggregationFac.NoOfDaFacilityReports}}</h3>

please let me know where i am going wrong

CodePudding user response：

This issue is solved in comments, just writing it here so that people in future can find this.

MongoDB aggregate always returns an array, so you will have to use

aggregationFac[0].NoOfDaFacilityReports

Types are helpful in angular, rather than using any