- 通过订阅Observable对象来等待API调用返回数据。在组件中定义一个Observable对象并订阅它,当API调用返回数据时,数据将通过订阅的回调函数传递给组件。
import { Component } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { Observable } from 'rxjs';
@Component({
selector: 'app-my-component',
template: `{{ data }}`
})
export class MyComponent {
data$: Observable;
constructor(private http: HttpClient) {
this.data$ = http.get('https://api.example.com/data');
this.data$.subscribe(data => console.log(data));
}
}
- 使用async/await语法等待API调用返回数据。在组件中定义一个异步方法,使用async/await关键字等待API调用返回数据,然后将数据分配给组件的成员变量。
import { Component } from '@angular/core';
import { HttpClient } from '@angular/common/http';
@Component({
selector: 'app-my-component',
template: `{{ data }}`
})
export class MyComponent {
data: any;
constructor(private http: HttpClient) {
this.getData();
}
async getData() {
try {
this.data = await this.http.get('https://api.example.com/data').toPromise();
console.log(this.data);
} catch (error) {
console.error(error);
}
}
}