Функции, вызываемые до загрузки данных в angular - PullRequest
0 голосов
/ 12 марта 2020

Привет, я немного новичок в angular и у меня проблемы с загрузкой данных. В приведенном ниже фрагменте кода я вызываю две службы. В каждом сервисе я выводил что-то на консоль. После запуска обеих служб у меня есть фрагмент кода, который выводит мой номер заказа на консоль в дополнительное время. Однако каждый раз, когда я запускаю это. Это происходит через ngOnInit и выдает информацию ниже в консоли. Как я могу сказать последнему выводу консоли дождаться, когда первые две службы будут полностью завершены.

  • заказ не определен
  • массив депо Имя испытательного депо
  • длина складов 18

    ngOnInit(): void {
    //called first
    this.dataService.sendGetRequest().subscribe((data: any[]) => {
      this.orderInfoList = data;
      console.log("array of depots "+ this.orderInfoList.depots[1].name);
      console.log("length of depots "+ this.orderInfoList.depots.length);
    })
    //called second
    this.dataService.getOrder(+this.orderId).subscribe((data: any[]) => {
      this.order = data;
      console.log("order " + this.order.orderNumber);
    })
    //entered last
    console.log("order " + this.order.orderNumber);
    

    }

1 Ответ

0 голосов
/ 12 марта 2020

Функции службы данных являются асинхронными, поэтому вам необходимо запускать их асинхронно. Поскольку getOrder не зависит от результата sendGetRequest, вы можете запустить их параллельно, используя forkJoin.

Они будут выполнены, и подписка будет запущена только после завершения обоих.

ngOnInit(): void {
  forkJoin({
    getRequest: this.dataService.sendGetRequest(),
    order: this.dataService.getOrder(+this.orderId)
  }).subscribe(result => {
    this.orderInfoList = result.getRequest;
    this.order = result.order;

    console.log("array of depots "+ this.orderInfoList.depots[1].name);
    console.log("length of depots "+ this.orderInfoList.depots.length);
    console.log("order " + this.order.orderNumber);
  });
}

forkJoin также принимает массив наблюдаемых:

forkJoin([
  this.dataService.sendGetRequest(), 
  this.dataService.getOrder(+this.orderId)
]).subscribe(result => {
  this.orderInfoList = result[0];
  this.order = result[1];
});
...