Question

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

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

上面的代码工作正常。它位于名为＆＃39; soundData＆＃39;的提供商/服务中。问题出在下面的代码中。当我尝试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的新手。

Answer 1

您需要return

.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));
}

Answer 2

您可以按照以下模式进行操作。

您的服务方式

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 => {},
        () => {}
   );
}

在Ionic3

2 个答案: