使用Angular 2+动画遮罩位置

Question

我在用angular的动画库对mask-position属性进行动画处理时遇到了麻烦，我希望有人可以指出我要去哪里。

我知道这可行：

zip()

但是，当我尝试将其转换为有角度的动画时，完成后只是“弹出” ，而不是动画。

这是我当前使用的角度动画：

 @keyframes maskWipe{
     from {mask-position: 100% 0;}
     to {mask-position: 0 0;}
 }

注意：由于我使用的是chrome，因此我不得不使用webkitMaskPosition，而chrome将mask-position转换为webkit-mask-position。

[编辑]：忘记删除已注释掉的内容。

Answer 1

当然，我在发布此消息后不久便发现了问题。

无论如何，出于某种原因，您需要像这样将额外的过渡添加到CSS中

transition: mask-position 2s linear;

如果其他人出现在此帖子上，我将不做介绍。