對象顯示爲未定義的HTML即使它具有數據在服務

我非常新的角度，我設法跟隨旅行團的英雄教程很容易，並得到了整個應用程序的工作。我現在開始了一個新項目，它只是從Strava API獲取數據來顯示它。對象顯示爲未定義的HTML即使它具有數據在服務

到目前爲止，我已經成功地獲得活動列表，並顯示他們，他們在作爲對象的數組，我只是做同樣的事情，下面的第一個圖像，只能用不同的URL。

當我試圖找到運動員時，API正在響應一個JSON對象，我可以通過在getDataFromURL函數中輸出response.json()來看到該對象。

當我試圖輸出到使用{{athlete.id}}的頁面我只是得到一個Cannot read property 'id' of undefined錯誤。我試圖改變一堆東西到達這個階段，但卻無法讓它起作用。任何幫助，將不勝感激。

//getAthlete and getDataFrom URL from the service 
/* Recieve data from a given URL over jsonp */ 
private getDataFromURL(url: string): Promise<any> { 
    return this.jsonp.get(url) 
     .toPromise() 
     .then(response => response.json()) 
     .catch(this.handleError) 
} 

/* Get details of a single athelete */ 
getAthlete(): Promise<any> { 
    let url = 'https://www.strava.com/api/v3/athlete?per_page=1&access_token=' + this.accessToken + '&callback=JSONP_CALLBACK'; 
    return this.getDataFromURL(url) 

}

//getAthlete from the component 

athlete: Object 

getAthlete(): void { 
    this.stravaService.getAthlete().then(athlete => this.athlete = athlete) 
} 

ngOnInit(): void { 
    this.getAthlete() 
}

//Here is the html code to try and put athelete.id on the page 

<span class="id">{{athlete.firstname}}</span>

來源

2016-09-18 Swapnull

請添加代碼作爲文本而不是截圖。屏幕截圖不可搜索。 –

使用

{{athlete?.id}}

使代碼null -safe爲異步加載的數據。

來源

2016-09-18 18:20:05

是的，這工作表示感謝。 – Swapnull

對象顯示爲未定義的HTML即使它具有數據在服務

回答

相關問題