时间戳

首页 > 解决方案 > 从 REST API 获取值后，在 Angular js 中订阅返回值未定义

angular - 从 REST API 获取值后，在 Angular js 中订阅返回值未定义

问题描述

这是 REST API 返回的数据

{

    "clo_change": 91.0,
    "vam_change": 72.76,
    "sla_change": 94.0,
    "feedback_change": 87,
    "so_change": 69.0,
    "cost": 87277.75

}

在我的 service.ts 文件中，我正在向 URL 发出请求

public getNewPlanData(): Observable<any>{
console.log("I am here createNewPlanModel");
    return this.http.get('http://localhost:8000/newplandata/')
        .map((response: Response) => {
         console.log("I am here createNewPlanModel2");
         return response.json()
        });
  }

我订阅了 component.ts 文件中的 observable

this.mainService.getNewPlanData().subscribe(result =>{ 
      console.log("inside subscribe")
     this.newData=result;    
     console.log(this.newData)         
     }, error => console.log(error));  
    console.log("outside subscribe")

当我在 Chrome 中调试代码时，第一次没有命中应用程序并且

该值未定义并打印“外部订阅”

并且在第二次我从 REST API 获取值并且这些值被打印在订阅循环中但它没有进入下一个语句 console.log("outside subscribe")而是抛出错误

返回值：未定义

并且这些值不用于进一步处理。

我希望在订阅循环之外使用 this.newData 值进行进一步处理。请帮助我如何解决它。

标签： angularsubscribe

解决方案

您可以在这种情况下使用超时，这可能会有所帮助。

  setTimeout(() => {
      this.mainService.getNewPlanData().subscribe((result) => {
        console.log('inside subscribe');
        this.newData = result;
        console.log(this.newData);
      },
        (error) => {
          console.log(error);
        });
    }, 1000 );
    console.log('now I will have data '+this.newData);

推荐阅读