Javascript 元素已加载到DOM中时发生的事件

使用Angular，我创建了一个显示数据的表。数据来自一个CSV，该CSV使用Papa解析库进行解析。我的数据几乎可以立即在控制台中使用，但在表格中显示大约需要10秒钟。以下是表格的代码：

<div class="table-responsive" *ngIf="searchData?.length" style="padding-bottom: 10px;">
  <table class="table table-striped table-sm">
    <thead>
      <tr>
        <th *ngFor="let header of headers">{{header}}</th>
      </tr>
    </thead>
    <tbody>
      <tr *ngFor="let record of searchData; let i = index">
        <ng-container *ngIf="((i && !searchOn) || searchOn) && record.length > 1">
          <td *ngFor="let index of indexes; let x = index">
            <a *ngIf="x == 3" href="{{record[index]}}" target="_blank">{{record[index]}}</a>
            <ng-container *ngIf="x != 3">{{record[index]}}</ng-container>
          </td>
        </ng-container>
      </tr>
    </tbody>
  </table>
</div>

{{header}}
{{记录[索引]}

---

我想在加载表时显示一个加载微调器，但需要在数据加载到DOM时监听。如何执行此操作？

您已经有了

*ngIf=“searchData？.length”

，因此这将在加载数据时起作用。现在，您只需要在加载数据时显示微调器。。。只需将另一个

if

条件添加到if

not

：

<div *ngIf="!searchData?.length">Loading...</div>

正在加载。。。

我建议找出10秒的根本原因，而不是显示加载微调器。渲染延迟。我可以清楚地看到的一个原因是嵌套的

*ngFor

，带有

*ngIf

条件。你能分享一些样本数据吗。一次播放多少张唱片？