@Injectable() export class ApiService { constructor(private httpClient: HttpClient) {}
getData(): Observable
@Component({ selector: 'app-table', templateUrl: './table.component.html', }) export class TableComponent implements OnInit { data: any[] = [];
constructor(private apiService: ApiService) {}
ngOnInit(): void { this.apiService.getData().subscribe((response) => { this.data = response; }); } }
Column 1 | Column 2 | Column 3 |
---|---|---|
{{ item.column1 }} | {{ item.column2 }} | {{ item.column3 }} |
这样,Angular 就会调用 API 一次并将结果存储在表格中,而不是多次调用 API 以创建表格。