如何将数据从 angular 6 typescript 动态传递到 animateTransform "from" 属性？

Question

我尝试了几种方法，以下是我的尝试：

在我的打字稿文件中，我将值设置为：

this.value = "130"; //for first method
this.rotation = "130 192 190"; //for second method

在 component.html

<animateTransform attributeName="transform"
                  type="rotate"
                  from="{{value}} 192 190"
                  to="0 192 190"
                  dur="3s"></animateTransform>

第二种方法：

<animateTransform attributeName="transform"
                  type="rotate"
                  [attr.from]="rotation"
                  to="0 192 190"
                  dur="3s"></animateTransform>

这两种方法都不起作用。有什么办法吗？

Answer 1

两者取长补短：

this.value = "130"

有

<animateTransform attributeName="transform"
                  type="rotate"
                  [attr.from]="value + ' 192 190'"
                  to="0 192 190"
                  dur="3s"></animateTransform>

如何将数据从 angular 6 typescript 动态传递到 animateTransform "from" 属性？

How to pass data dynamically from angular 6 typescript to animateTransform "from" attribute?

svg

animatetransform

angular6