电子+角度材料2：默认材质动画

Question

有时（随机），当我在angular5应用程序中使用材质组件时，默认动画完全打破了UI（相对和绝对定位）：

• 打开/关闭MatDialog动画
• MatStepper上的过渡步骤动画
• MatTab上的转换标签动画

步进过渡动画问题：

对话框打开/关闭动画问题：

我的应用程序的多个部分都有此行为。它实际上是不规则的，有时它渲染得很好，有时它会失败所有相对/绝对定位（即使检查员也无法正确地定位元素）：

如果我使用[@.disabled]="true"手动禁用步进动画，则步骤之间的错误消失：

但是打开/关闭对话框的错误仍然存​​在。在下面的gif中，步进动画被禁用，并且连续3个打开/关闭对话框，我打破了输入，我无法在其中写入内容并验证步骤：

我还没有发现任何与这种行为相关的问题，所以我猜我几个月前犯了一个错误，我无法指责它。

什么可能导致此类问题以这种方式打破定位？ 我的CSS中没有任何自定义动画，我的组件中没有任何内容可以改变我元素的位置......

Answer 1

将电子从v1.7.11升级到v1.8.2解决了我的问题。我可以在多台计算机上重现（Windows / Mac OS X）。

Answer 2

我们的Electron / Angular Material应用程序中存在同样的问题。这是@Thibaud正确指出的Electron本身的问题。当你在一些动画内容（= modals，tabs，stepper，..）中有Material（主要）表单元素时会发生。

解决这个问题的一种方法是显然更新到Electron 1.8.2（在我们的案例中没有用，但其他人已经成功了。

另一个是在父元素上禁用动画 - 明确地通过[@.disabled]="true"或globally in the whole app。