Angular ng-Animate not working after 1.26

Question

I am using class="animationName" instead of ng-animate, as it has changed with 1.2. However I can't seem to get the below to work. What am I missing?

CSS:

 .move-animation.ng-move {
    -webkit-transition:all linear 1s;
    -moz-transition:all linear 1s;
    -ms-transition:all linear 1s;
    -o-transition:all linear 1s;
    transition:all linear 1s;
     max-height: 0;
    opacity:0;
}
  .move-animation.ng-move.ng-move-active {
    max-height: 250px;
    opacity:1;
}

HTML:

    <div ngApp="MyApp">
    <div ng-controller="App">
        <button ng-click="add()">Add</button>
        <ul>
            <li class="move-animation" ng-click="remove($index)" ng-repeat="name in names">{{name}}</li>
        </ul>
    </div>
</div>

Controller:

angular.module('MyApp', []);

function App($scope) {
    $scope.names = [];
    var data = [];
    for (var i = 0; i < 100; i++) {
        data.push('item' + i)
    }
    $scope.add = function () {
        if (data.length) $scope.names.splice(0, 0, data.pop());
    };
    $scope.remove = function (index) {
        $scope.names.splice(index, 1);
    };
}

This is with 1.26: http://jsfiddle.net/6t42M/178/ Here's the same older fiddle, with 1.1. It's working: http://jsfiddle.net/6t42M/100/

David · Accepted Answer · 2015-09-08T15:21:35.640

Working fiddle, 1.4.2.

JS:

    angular.module('MyApp', ['ngAnimate'])
.controller('AppController', ['$scope', function ($scope) {
    $scope.names = [];
    var data = [];
    for (var i = 0; i < 100; i++) {
        data.push('item' + i)
    }   
    $scope.add = function () {
        if (data.length) $scope.names.splice(0, 0, data.pop());
    };
}]);

HTML:

<div ngApp="MyApp">
    <div ng-controller="AppController">

        <button ng-click="add()">Add</button>
        <ul>
            <li class="fadeLine" ng-repeat="name in names">{{name}}</li>
        </ul>
    </div>
</div>

CSS:

 .fadeLine.ng-enter {
    transition:0.5s linear all;
      opacity:0;
}
  .fadeLine.ng-enter-active {
        opacity:1;
}

Angular ng-Animate not working after 1.26

1 Answers1