Angular Material-有条件地禁用动画

Question

我在应用程序中使用了 Angular 6 ，包括 Angular Material 6.0.1 。
我使用Tab layout作为父母，可能有Collapsible作为孩子。

我尝试使用 @disabled property 在父选项卡中禁用动画，但同时也禁用了可折叠动画。

是否有解决方法？

Answer 1

尽管内部动画被禁用，但是父动画可以对位于模板的禁用区域中的内部元素进行query（）并在需要时对其进行动画处理。父级查询子动画然后再使用animateChild（）进行动画处理时，也是如此。

animations: [
trigger('queryAnimation', [
transition('* => goAnimate', [
query('h1', style({ opacity: 0 })),
query('h1', animate(1000, style({ opacity: 1 })),
query('.content', animate(1000, style({ opacity: 1 }))
])
 ])
]