Question

我正在使用Web API提取json对象，并使用* ngFor Structural Directive将其显示在表格中。但是问题是，尽管立即获取对象并在控制台中显示该对象，但是要花一些时间才能将其显示在表中。我希望该对象一进入控制台就立即在表中显示。

component.html文件；

 <tr *ngFor="let data of orgData" id="{{data.Id}}">
          <td hidden><input type="number" id="1" value="{{ data.Id }}"></td>
          <td>{{ data.OrganisationName }}</td>
          <td>{{ data.ContactPerson }}</td>
          <td>{{ data.ContactPersonHPNo }}</td>
          <td>{{ data.ContactPersonEmailId }}</td>
          <td>{{ data.SubscriptionStatus }}</td></tr>

component.ts文件；

  ngOnInit() { 
// making use of web API
this.httpService.get('http://url/StudyExAPI/GetOrganisations?Id=').subscribe(
  data => {
    this.orgData = data as string[];
    // console.log(this.orgData);
  },
  (err: HttpErrorResponse) => {
    console.log(err.message);
  }
);}

Answer 1

如果数组中有很多对象，则可以使用软件包@angular/cdk提供的虚拟滚动视口，该视口仅呈现可见元素。

如何减少使用* ngFor结构化指令在表中显示列表（从数据库中获取的json对象）的时间？

1 个答案: