Question

我有一个看起来像这样的模板：

<p ng-repeat="item in myobj.items" class="toAnimate">{{item}}</p>

我想使用animate模块使用文档中描述的JavaScript方法对元素执行jQueryUI addClass / removeClass动画：

ngModule.animation('.toAnimate', function() {
  return {
    enter: function(element) {
      element.addClass('pulse').removeClass('pulse', 2000);
    }
  };
});

这很好用，但问题是，因为我想使用p.toAnimate元素来显示状态消息，所以它不会根据角度改变内容。

要进一步细分，说我有一个名字字段。当我点击Save时，会显示消息Name was saved successfully.。现在，如果我修改名称并再次单击“保存”，则假设保存成功，应重新显示该消息以向用户提供新编辑的名称的反馈。但是，脉冲不会发生，因为myobj.items中的项目在技术上没有变化。

我意识到我可以在一段时间后移除该项目（这可能是我将采用的路线来实现真正的解决方案），但我仍然有兴趣看看是否可以使用这种方式来完成AngularJS。

我想要做的是使用angular注册消息应该被视为新消息，即使它不是。有没有办法做到这一点？

与此相关的小提琴：http://jsfiddle.net/Jw3AT/

更新

在我的回答中$scope.$$phase方法存在问题，所以我仍然在寻找“正确”的方法来做到这一点。基本上，$scope.$$phase始终返回$digest，这会导致条件失败。删除条件会在界面中显示正确的结果，但会抛出$rootScope:inprog。

Answer 1

我找到的一个解决方案是在控制器功能的中间添加$apply：

$scope.updateThingy = function () {
    $scope.myobj.items = [];
    if (!$scope.$$phase) {
        $scope.$apply();
    }
    $scope.myobj.items = ['Your name was updated.'];
};

更新了小提琴：http://jsfiddle.net/744Rv/

可能不是最好的方式，但这是一个答案。

如何使用AngularJS为未更改的ng-repeat设置动画

更新

1 个答案: