时间戳

首页 > 解决方案 > Angular 的 HTTP 订阅方法未正确分配实例变量

angular - Angular 的 HTTP 订阅方法未正确分配实例变量

问题描述

 private getAllData(): void {
    this.stamm_solvara_jahrService.getAll().subscribe(resp => {
        const keys = resp.headers.keys();
        this.headers = keys.map(key=> `${key}: ${resp.headers.get(key)}`);
        this.stamm_solvara_jahrData = {...resp.body};

        console.log('Data inside method');
        console.log(this.stamm_solvara_jahrData);
        console.log('Header inside method'); 
        console.log(this.headers);
    });
    console.log('Data outside method');
    console.log(this.stamm_solvara_jahrData);
    console.log('Header outside method');
    console.log(this.headers);
}

因此，在订阅“流程”中，两个实例变量this.stamm_solvara_jahrData都this.headers具有一个值。除此之外，它们都是空的。如何解决这个问题？

标签： angulartypescriptsubscribe

解决方案

this.stamm_solvara_jahrService.getAll()是一个异步方法，这就是为什么你必须调用subscribe它。

因此，this.stamm_solvara_jahrData并且this.headers将在执行订阅回调时定义，但其余代码（订阅之外）不会等待这种情况发生，它会简单地尝试打印这两个变量，这仍然是undefined.

我强烈建议阅读有关异步与同步代码的内容，以更好地理解为什么这种事情会在像 javascript 这样的语言中发生。

推荐阅读