你可以使用async
管道来处理异步数据,并结合ngFor
来循环显示数据。以下是一个示例代码:
首先,在你的组件中,定义一个异步函数,它返回一个Promise或Observable对象,表示你的异步数据:
import { Component } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { Observable } from 'rxjs';
@Component({
selector: 'app-root',
template: `
{{ item.name }}
`
})
export class AppComponent {
items$: Observable;
constructor(private http: HttpClient) {
this.reload();
}
reload() {
this.items$ = this.http.get('your-api-url');
}
}
然后,在你的模板中,使用async
管道来订阅异步数据,并使用ngFor
来循环显示每个数据项。当点击"Reload"按钮时,调用reload()
函数重新加载数据。
请注意,你需要在你的模块中引入HttpClientModule
并在构造函数中注入HttpClient
,以便进行HTTP请求。
希望这可以帮助到你!