如何僅在可用時使用提供者發送的數據？

我有一個提供程序從JSON讀取數據，我希望它將數據發送到頁面。爲了確保數據很好地發送到UI我有一個console.log應該顯示數組的第一個元素，但問題是，我不知道如何只調用此console.log一旦信息已被提供者檢索並傳遞。當然意圖不是console.log，而是一旦它被提供者傳遞，就要用數據做實際的事情。如何僅在可用時使用提供者發送的數據？

提供者：

getWorldCities(){ 
    if (this.worldCities) { 
    // already loaded data 
    return Promise.resolve(this.worldCities); 
} 
    this.http.get('../assets/city.list.json') 
     .map(res => res.json()).subscribe(data => { 
     console.log(data.status); 
     console.log(data); 
     console.log(data.headers); 
     this.worldCities = data; 
     return Promise.resolve(this.worldCities); 
     }, 
     err => console.log(err), 
    () => console.log('yay') 
    ) 
    } 

}

而且在我的網頁：

ionViewDidLoad() { 
    console.log('ionViewDidLoad ChooseCity'); 
    console.log(this.worldCities); 
    this.AppCitiesProvider.getWorldCities().then(data => { 
     this.worldCities = data; 
     console.log(this.worldCities[0]); 
    }); 
    }

我得到的錯誤是：

無法讀取的不確定

屬性 '然後'

我應該如何正確地做到這一點？

來源

2017-10-18 Krowar

一旦數據被接收，檢索數據和執行操作的「最佳實踐」就是使用Observable而不是承諾。事情是這樣的：

在服務：

getMovies(): Observable<IMovie[]> { 
    return this.http.get<IMovie[]>(this.moviesUrl) 
     .do(data => console.log(JSON.stringify(data))) 
     .catch(this.handleError); 
} 

handleError(error) { 
    // Your error handling here. 
    console.error(error); 
}

在組件：

ngOnInit(): void { 
    this.movieService.getMovies() 
     .subscribe(
      (movies: IMovie[]) => { 
       this.movies = movies; 
       this.filteredMovies = this.performFilter(this.listFilter); 
      }, 
      (error: any) => this.errorMessage = <any>error); 
}

到訂閱第一回調函數中的任何代碼後，纔可以執行數據被檢索。

查看更多信息（和圖片！）Subscribe to observable is returning undefined

來源

2017-10-18 21:41:10 DeborahK

謝謝，雖然我有一個問題。什麼是this.handleError？它會在我的代碼中產生問題，我不知道如何解決它。另外爲什麼你有這個.http.get ？而不是簡單的http.get？非常感謝你 – Krowar

我使用的是屬於Angular 4.3的新HttpClient。如果您使用的是舊版本的Angular，那麼您需要較舊的語法，而不使用通用參數''。 'handleError'只是一個處理任何錯誤的方法。 – DeborahK

如何僅在可用時使用提供者發送的數據？

回答

相關問題