Angular 4.2.4 带参数的动画不工作

Question

我有以下动画：

animations: [
    trigger('moveSomething', [
        state('true', style({left: '{{leftPosition}}' , opacity: 0.5}), {params: {leftPosition: 0}}),
        transition('* => *', animate(300))
    ])
]

这是 html

[@moveSomething]="{value: shouldMove, leftPosition: leftPosition}"

我确定动画已触发，因为我看到不透明度发生变化。我阅读了一堆关于堆栈溢出的文档和答案，但似乎看不出问题所在。

我想提一下 leftPosition 是一个整数，但我也尝试了一个变量，它是这种形式的字符串 150px，但没有成功。

有没有想过为什么这不起作用？

Answer 1

所以问题是我认为我有 Angular 4.2.4，但实际上是 4.4.7，我试图按照 4.4.6 之前的方式发送参数。

最终的解决方案是

animations: [
    trigger('moveSomething', [
        state('true', style({left: '{{leftPosition}}px' , opacity: 0.5}), {params: {leftPosition: 0}}),
        transition('* => *', animate(300))
    ])
]

还有HTML

[@moveSomething]="{value: shouldMove, params: {leftPosition: leftPosition}}"

Angular 4.2.4 带参数的动画不工作

Angular 4.2.4 animations with params don't work

angular

angular-animations