Javascript Angular js animate on$scope变量更新on<；p>；标签 $interval（函数（）{ 变量计数=$scope.announcements.length； 对于（变量i=0；i=100）{ $scope.readmore=true； $scope.short_ann=$scope.announcement.substr（0,85）； } 打破 }否则{ $scope.announcement=$scope.announcements[i+1]。说明； 如果（$scope.announcement.length>=100）{ $scope.readmore=true； $scope.short_ann=$scope.announcement.substr（0,85）； } 打破 } } } }, 5000);

$scope.announcement每5秒更新一次，我想要一个小动画，同时更改此的ng绑定

使用ng model到您的p标记以显示实际数据，以及ngAnimate或smth else

$interval(function() {
        var count = $scope.announcements.length;
        for(var i=0;i<count;i++) {
            if($scope.announcement == $scope.announcements[i].description) {
                if(i==count-1) {
                    $scope.announcement  = $scope.announcements[0].description;
                    if($scope.announcement.length >= 100) {
                        $scope.readmore     = true;
                        $scope.short_ann    = $scope.announcement.substr(0,85);
                    }
                    break;
                } else {
                    $scope.announcement  = $scope.announcements[i+1].description;
                    if($scope.announcement.length >= 100) {
                        $scope.readmore     = true;
                        $scope.short_ann    = $scope.announcement.substr(0,85);
                    }
                    break;
                }
            }
        } 
    }, 5000);

{{announcement}

---

创建一个指令，用于监视属性上的值更改并执行动画

例如：

<p ng-model="announcement">{{announcement}}</p>

用法：

app.directive('flash', ['$animate',
  function($animate) {
    return {
      link: function(scope, element, attrs) {

        scope.$watch(attrs.flash, function(newValue, oldValue) {

          if (newValue === oldValue) return;

          $animate.addClass(element, 'flash').then(function() {
            element.removeClass('flash');
          });
        });
      }
    };
  }
]);

对于第二个版本，您需要观看

attrs.ngBind

，而不是

attrs.flash

：

<p flash ng-bind="announcement" class="animated"></p>

请注意，此示例使用

ngAnimate

和

animate.css

执行动画

---

演示：

感谢您的大力帮助

<p flash ng-bind="announcement" class="animated"></p>

scope.$watch(attrs.ngBind, ...