這是我的服務代碼片段：
@Injectable({
providedIn: 'root',
})
export class UserDataService {
constructor(private http: HttpClient) {}
tableData = <SampleDataStructure[]>[]; // SampleDataStructure is the interface
url: string =
'https://some_sample_data.json'; //dummy url
getTableData(): SampleDataStructure[] {
this.http.get(this.url).subscribe((data) => {
for (let user in data) {
let userData = <SampleDataStructure>{};
//setting required fields as per SampleDataStructure interface
userData.S_No = data[user]['s.no'];
userData.country = data[user]['country'];
userData.location = data[user]['location'];
userData.num_backers = data[user]['num.backers'];
userData.end_time = data[user]['end.time'];
this.tableData.push(userData);
//console.log(this.tableData); // *shows data here in tableData as expected
}
});
//console.log(this.tableData); //**shows empty array here
return this.tableData;
}
}
我期望tableData填充所需的資料。相反，它向我顯示了空陣列（在標有注釋 ** 的行處）。雖然它在標有注釋的行顯示預期資料*
我知道我犯了一些非常愚蠢的錯誤，有人可以幫我解決這個問題。提前致謝！
uj5u.com熱心網友回復：
訂閱正在異步作業。這意味著呼叫 url 并且程式不會等到它完成 ( http.get(this.url))。因此，return this.tableData;在執行之后http.get執行，但在get完成之前或之后的任何時間都可以獲取資料。
這就是為什么console.log(this.tableData);總是顯示資料，并且return this.tableData;不能回傳任何內容或資料。
最好的是 getTableData 像這樣回傳可觀察的簽名：
public getTableData(): Observable<SampleDataStructure[]> {
return this.http.get(this.url).pipe(map(data) => {
轉載請註明出處，本文鏈接：https://www.uj5u.com/caozuo/408146.html
標籤：