Javascript 当变量随角度变化时，如何使某个对象闪烁

我是angular的新手，我有一些css如下：

.heartbeat
{
     transition:opacity 0.5s linear;
}

.heartbeat-active
{
    opacity: 1;
}

<div highlight-on-change="{{value}}"></div>

定期更新作用域上的属性。当属性更改时，如何使此转换运行一次

---

我已经研究了ngAnimation和addClass，但还没有弄清楚如何以声明的方式将它们粘在一起。如果可能的话？

只需监视您提到的属性，并在触发监视时激活addClass heartbeat

$scope.$watch('yourProperty', function(new, old) {
  if(new != old)
     $scope.yourElement.addClass(".heartbeat-active");
});

我假设要闪烁的元素在范围内被引用。

---

第二件事-您应该为heartbeat类添加一些不透明度的初始值。

受gnom1gnoms answer和这个线程的启发，我最后做的是：

app.directive('highlightOnChange', function() {
  return {
    link: function($scope, element, attrs) {
      attrs.$observe('highlightOnChange', function(val) {
        var el = $(element);
        el.removeClass('heartbeat');
        _.defer(function() {
          el.addClass('heartbeat')
        });
      });
    }
  };
});

也就是说，创建一个指令会观察属性。然后我可以这样使用它：

.heartbeat
{
     transition:opacity 0.5s linear;
}

.heartbeat-active
{
    opacity: 1;
}

<div highlight-on-change="{{value}}"></div>

---

并且不需要从$scope引用元素。

-1非常不干净。这不应该是

$watch

，而是一个角度动画。另外，除非

new

和

old

不同，否则

$watch

不应启动，因此不需要if语句。另外，千万不要给变量命名

new

这是javascript的保留字。@Freshyeball谢谢你的评论。我的指令和你提到的角度动画有什么区别？animatin更适合吗？animatin是它自己的动物，也是angular内置的基础设施的一部分，用于管理这类事情。对于动画，您不必使用

$watch

，它应该是可以在HTML级别声明的内容。