Получить сумму дочерних узлов всех узлов

Question

Я хочу получить сумму всех поставок для каждого поставщика, используя Angular

Массив имеет значение в консоли, но не проходитк данным в диаграмме

Я пробовал различные методы, но все же, это не работает

Я хочу, чтобы сумма поставок по оси Y (сумма узла поставки в базе данных Firebase) противназвание компании (которая является узлом поставщика в базе данных)

Работает нормально для названий компаний, но не для суммы узлов поставки

export class SupplierListComponent implements OnInit {

  constructor(private service : SuppliersService,
    private dialog: MatDialog,
    private router : Router,
    private serv : SuppliesService,
    private db :AngularFireDatabase) { }

    listData: MatTableDataSource<any>;

    x:MatTableDataSource<any>;
    supplyList : AngularFireList<any>;
    displayedColumns: string[] =[`supName`,`compName`,`email`,`mobile`,`address`,`actions`];
    supplierList :  string[] = [];
    supplysumList : number[] = [] ;
    arr : any[] = [];
    sumsup : number = 0;
    companyNameList: any[] = [];
    key : string;

    BarChart=[];
    expandedElement : MatTableDataSource<any>;


    @ViewChild(MatSort,{static: true}) sort: MatSort;
    @ViewChild(MatPaginator,{static: true}) paginator: MatPaginator;
    searchKey: string;

    ngOnInit() {
    this.service.getSuppliers().subscribe(
      list => {
        let array = list.map(item =>{
          return {
            $key: item.key,
            ...item.payload.val(),          
          };
        });
        this.listData = new MatTableDataSource(array);
        this.listData.sort = this.sort;
        this.listData.paginator = this.paginator;
        this.expandedElement = null;
      array.forEach(element => {
        this.supplierList.push(element.$key)
        this.companyNameList.push(element.compName);
      });

      for ( let i = 0; i < this.supplierList.length; i++){
        this.serv.getSupplys(this.supplierList[i]);
        this.serv.getSupply().subscribe(
          list1 => {
            let array1 = list1.map(item =>{
              return { 
                $key: item.key, 
                ...item.payload.val()
              };
            });  
           this.sumsup = array1.length;
           this.supplysumList.push(this.sumsup);

          }

        );
      }

    }
    );

console.log(this.companyNameList);
console.log(this.supplysumList);




     this.BarChart = new Chart('barChart', {

      type: 'bar',
    data: {
     labels:this.companyNameList,
     datasets: [{
         label: '# of Votes',
         data  :  [this.supplysumList],
         backgroundColor: [
             'rgba(255, 99, 132, 0.2)',
             'rgba(54, 162, 235, 0.2)',
             'rgba(255, 206, 86, 0.2)',
             'rgba(75, 192, 192, 0.2)',
             'rgba(153, 102, 255, 0.2)',
             'rgba(255, 159, 64, 0.2)'
         ],
         borderColor: [
             'rgba(255,99,132,1)',
             'rgba(54, 162, 235, 1)',
             'rgba(255, 206, 86, 1)',
             'rgba(75, 192, 192, 1)',
             'rgba(153, 102, 255, 1)',
             'rgba(255, 159, 64, 1)'
         ],
         borderWidth: 1
     }]
    }, 
    options: {
     title:{
         text:"Bar Chart",
         display:true
     },
     scales: {
         yAxes: [{
             ticks: {
                 beginAtZero:true
             }
         }]
     }
    }
    });
  }