如何禁用Angular Material Expansion Panel动画？

Question

单击扩展面板时如何禁用动画？我尝试了这个：

::ng-deep .mat-expansion-panel-header {
    transition: none !important; 
}

还有这个：

::ng-deep .mat-expansion-panel-body {
    transition: none !important; 
}

但是没有人为我工作，动画仍然存在。

<mat-expansion-panel>
  <mat-expansion-panel-header>
    Settings
  </mat-expansion-panel-header>
    Some content
<mat-expansion-panel>

Answer 1

你可以加

[@.disabled]="true"

绑定到您的<mat-expansion-panel>元素以禁用给定面板的动画。

在此处阅读更多信息：https : //angular.io/api/animations/trigger#disabling-animations