Javascript 在Ionic3中订阅提供程序后，Console.log显示为未定义

我试图在我正在构建的Ionic 3应用程序中使用Spotify api获取数据，但由于某种原因，当我尝试console.log数据时，它显示为未定义。让我展示一些代码，然后进一步解释。这是我的getData（）：

上面的代码运行良好。它位于名为“soundData”的提供商/服务中。问题在于以下代码位。当我尝试console.log记录数据时，它在我的浏览器中显示为未定义：

ionViewDidLoad(){
    this.soundData.getData().subscribe(
        returnedData=> {
            this.data = returnedData;
            console.log(this.data) //this shows as undefined
        },
        returnedError => {
            this.error = returnedError;
        });
}

---

我真的不知道我做错了什么。看起来一切都应该很好，但可能我遗漏了一些东西，因为我是TypeScript和Ionic的新手。

您需要

从
返回
。map

getData() {
    console.log("getData has been called!!!");
    return this.http.get(this.dataUrl).map((res) => {
        console.log(res.json());//this works fine
        return res.json();
    });
}

更惯用的方法是使用
.do
方法单独执行日志记录操作，如中所示

getData() {
    return this.http.get(this.dataUrl)
        .map(res => res.json())
        .do(json => console.log(json));
}

您可以简单地遵循以下模式

您的服务方式

getData(): Observable<your-data-type>{
       return this.http.get(this.dataUrl).map(res => res.json());
  }

getData(): your-data-type {
   this.soundData.getData().subscribe(
        returnedData => {
            this.data = returnedData;
         },
        err => {},
        () => {}
   );
}

getData(): your-data-type {
   this.soundData.getData().subscribe(
        returnedData => {
            this.data = returnedData;
         },
        err => {},
        () => {}
   );
}