状态之间的角度过渡动画仅针对一种状态正确设置动画

Question

我正在尝试将可扩展行添加到角度材料表中，因此我找到了一个示例。我通过将角度版本升级到 ^7.0.0 来修改示例，突然动画在从“折叠”过渡到“展开”时停止工作。 Here is a stackblitz demonstrating the problem。如果您单击一行来展开它，在短暂的延迟之后，该行会立即展开。然后，如果您再次单击该行以将其折叠，则动画将正常工作。如何修复动画以便正确展开行动画？

Answer 1

只要保持动画的高度

  state('expanded', style({height: '*'})),
  state('collapsed', style({height: '0px'})),

display: 'none'} 看起来有问题。

https://stackblitz.com/edit/angular-lb7n8q-ldwsld?file=app/table-expandable-rows-example.ts