元素已加載到DOM中時發生的事件

Question

使用Angular，我創建了一個顯示數據的表。 數據來自使用Papa Parse庫解析的CSV。 我的數據幾乎可以立即在控制台中使用，但是大約需要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>

我想在表加載時顯示加載微調器，但是當數據加載到DOM中時需要偵聽。 我怎樣才能做到這一點？

Answer 1

您已經具有*ngIf="searchData?.length"因此這將在加載數據時起作用。 現在，您只需要在加載數據時顯示微調框...只需添加另一個if條件，如果條件not ：

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