Angular-Material 制表符转换缓慢

Question

我使用 Angular Material 的选项卡创建了一个包含许多表单的选项卡。 Demo

由于导航到这些繁重的选项卡需要很长时间，我想显示一个正在加载选项卡的对话框。但是用mat-tab-group的click或者selectedTabChange事件，在dialog出现之前就卡屏了，tab移动后才出现dialog

<md-tab-group (click)="openDialog()">
  <md-tab label="light-page1">
    <app-light-page></app-light-page>
  </md-tab>
  <md-tab label="heavy-page">
    <app-heavy-page></app-heavy-page>
  </md-tab>
  <md-tab label="light-page2">
    <app-light-page></app-light-page>
  </md-tab>
</md-tab-group>

是否可以在移动到较重的标签时使屏幕冻结并显示正在加载？

Answer 1

我使用 cdk-virtual-scroll-view link 重新设计了页面以减少加载时间。

Angular-Material 制表符转换缓慢

Angular-Material slow tab transition

javascript

typescript

angular-material

angular