Как получить значение свойства, используя машинопись в угловых 7

Question

Я хочу получить значение из моего свойства countOnProgress.Я могу получить значение countOnProgress, когда я подписываюсь, но за пределами подписки countOnProgress возвращает 0, поэтому я не могу использовать countOnProgress на progressLastYear.Как установить значение countOnProgress со значением из подписки без возврата 0

import { Component, OnInit, Inject } from '@angular/core';
import { Router } from '@angular/router';
import { DashboardService } from './dashboard.service';
import { Observable, of, timer } from 'rxjs';
import 'rxjs/add/operator/takeWhile';
import 'rxjs/add/observable/timer';

@Component({
  templateUrl: 'dashboard.component.html',
  styleUrls: ['./dashboard.component.css']
})
export class DashboardComponent implements OnInit {

  alive = true;
  countOnProgress:number = 0;
  max: number = 200;
  value: number = 100;
  stacked: any[] = [];

  constructor(@Inject (DashboardService) private dashboardService: DashboardService){ 
  }

  ngOnInit(): void {
    Observable.timer(0, 30000)
    .takeWhile(() => this.alive)
    .subscribe(() => {
      this.dashboardService.getCountProgress().subscribe(resp => {
        this.countOnProgress = resp.d;
        console.log(this.countOnProgress); //It found the data
      })
    });
    this.progressLastYear();
  }

  progressLastYear(): void{
    const types = ['success', 'info', 'warning', 'danger'];
    const values = [this.countOnProgress];
    console.log(values);
    this.stacked = [];
    for (let i = 0; i < 5; i++) {
      this.stacked.push({
        value: values[1],
        type: types[i],
        label: values[1]
      });
      console.log(this.stacked); //The datas: 0, succes, 0 (didnt get countOnProgress' value)
    }
  }
}

Спасибо

Answer 1

Измените код, как показано ниже:

ngOnInit(): void {
    Observable.timer(0, 30000)
    .takeWhile(() => this.alive)
    .subscribe(() => {
      this.dashboardService.getCountProgress().subscribe(resp => {
        this.countOnProgress = resp.d;
        console.log(this.countOnProgress); //It found the data
        this.progressLastYear();   // < -- move the function call here
       })
    });

  }

Почему мой код не работает?

JS является асинхронным, поэтому он не ожидает получения запроса ввода-вывода завершить и продолжает выполнять следующие строки кода.

В вашем коде и Observable.timer(0, 30000), и this.dashboardService.getCountProgress() асинхронны. Следовательно, во время выполнения JS не будет ждать их завершения и продолжит выполнение следующей строки кода. В результате вызов метода this.progressLastYear() был вызван до завершения вызова службы. Следовательно, Вы не получаете значение countOnProgress.