首页 > 解决方案 > Angular 的 ngOnInit 中未填充数据

问题描述

我正在调用一个虚拟 Web API 来填充一个类变量以进一步使用它,但后来我遇到了一个奇怪的场景,这让我感到困惑:

export class myClass implements OnInit{ 
    data : any;    
    constructor (private http:HttpClient){}
    ngOnInit(){  
        this.http.get("http://dummy.restapiexample.com/api/v1/employee/82342").subscribe(e=>this.data = e);
        alert("beforeConsole");        
        console.log(this.data);
        var size = Object.keys(this.data).length;
        alert(size); 
    }
} 

变量数据仅在我使用时填充alert(仅用于检查)。如果我删除 alert("beforeConsole");然后控制台给我undefined

我无法理解这一点。请提出实际情况。

标签: angularngoninit

解决方案


Http.get 返回一个 Observable 并且是异步的。您的 console.log 在请求有时间处理之前运行。

将您的 console.log 移到您的订阅中,因为一旦发出 observable,它将运行。

this.http.get("http://dummy.restapiexample.com/api/v1/employee/82342")
   .subscribe(e => { 
     this.data = e;
     console.log(this.data);
     var size = Object.keys(this.data).length;
   });

推荐阅读