Функция, вызываемая в ngOnInit, возвращает пустой

Question

Как я могу console.log, когда массив series полностью заполнен. Я знаю, что ngOnInit - это asyn c, но как мне заставить мою функцию загружаться после завершения обработки, а не просто сразу console.log, когда значение не заполнено. Я знаю, что могу прикрепить setTimeout, но есть ли другой способ обойти это?

Вот что показывает мой console.log без setTimeout:

Вот что он показывает с setTimeOut (желательно result AKA заполненный массив серий)

Мой код без setTimeout:

import { Component, OnInit } from '@angular/core';
import { DataService } from '../../services/data.service';
import { ParseDataService } from '../../services/parse-data.service'
import { NgxChartsModule } from '@swimlane/ngx-charts';
import { Map } from './mapClass';

@Component({
  selector: 'app-recovered',
  templateUrl: './recovered.component.html',
  styleUrls: ['./recovered.component.css']
})
export class RecoveredComponent implements OnInit {
  globalRecovData: Array<any> = [];
  totalRecovByDate: Array<any> = [];
  totalRecovToday: number;

  constructor(private dataService: DataService, private parseData: ParseDataService) {}

  ngOnInit() {
    this.GlobalRecov();
    this.getMapData();
  }

  getMapData() {
    let map = new Map;
    const newMap = map.create({
      date: 'Recovered',
      series: []
    })
    this.totalRecovByDate.map(data => {
        newMap.series.push(data);
      })
      let newArrayMap = [];
      newArrayMap.push(newMap);
      console.log(newArrayMap)
  }

  GlobalRecov(){
      this.dataService.GlobalRecovGet().subscribe((rawdata) => {
        this.globalRecovData = this.parseData.parseGlobalData(rawdata, this.globalRecovData);
        this.totalRecovToday = this.parseData.getTotalToday(rawdata, this.globalRecovData);
        this.totalRecovByDate = this.parseData.getTotalByDate(rawdata, this.globalRecovData);


      })
    }
  }

Answer 1

Это потому, что dataService.GlobalRecovGet() асинхронный, поэтому getMapData() будет выполняться, пока ответ от GlobalRecov() все еще ожидает ответа. Поскольку getMapData() использует totalRecovByDate, который зависит от ответа от службы, в этот момент он будет неопределенным.

Вы можете рассмотреть возможность вложения getMapData() в GlobalRecov(). Это гарантирует, что getMapData() будет запущен после получения ответа от dataService.GlobalRecovGet().

ngOnInit() {
  this.GlobalRecov();
}

getMapData() {
  let map = new Map;
  const newMap = map.create({
    date: 'Recovered',
    series: []
  });
  this.totalRecovByDate.map(data => {
    newMap.series.push(data);
  })
  let newArrayMap = [];
  newArrayMap.push(newMap);
  console.log(newArrayMap)
}

GlobalRecov(){
  this.dataService.GlobalRecovGet().subscribe((rawdata) => {
    this.globalRecovData = this.parseData.parseGlobalData(rawdata, this.globalRecovData);
    this.totalRecovToday = this.parseData.getTotalToday(rawdata, this.globalRecovData);
    this.totalRecovByDate = this.parseData.getTotalByDate(rawdata, this.globalRecovData);
    this.getMapData();
  }) 
}