1.26之后,动画角无法正常工作

大卫

我使用的class="animationName"不是ng-animate,因为它已被1.2更改但是我似乎无法使以下内容正常工作。我想念什么?

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>

控制器:

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);
    };
}

这是1.26版:http : //jsfiddle.net/6t42M/178/这是旧的小提琴,版本为1.1。工作正常:http//jsfiddle.net/6t42M/100/

大卫

工作提琴,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;
}

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

Bukkit equalsIgnoreCase(“ gm 1”)无法正常工作

来自分类Dev

dataGridView1_CellValueChanged无法正常工作

来自分类Dev

CN1 CodeScanner无法正常工作

来自分类Dev

count()无法正常工作,返回1

来自分类Dev

cn1-Webview无法正常工作

来自分类Dev

动画无法正常工作

来自分类Dev

动画无法正常工作

来自分类Dev

动画无法正常工作?

来自分类Dev

动画无法正常工作

来自分类Dev

Underscore.js的Defer(或setTimeout 1)无法正常工作

来自分类Dev

覆盖bash PS1无法正常工作

来自分类Dev

删除1行后刷新以重复控制无法正常工作

来自分类Dev

1密码应用程序扩展无法正常工作

来自分类Dev

{flex:1}在React Native中无法正常工作

来自分类Dev

反应prevState和增量对象属性+1无法正常工作

来自分类Dev

Google Speech Api v1无法正常工作吗?

来自分类Dev

IE中的背景大小无法正常工作1

来自分类Dev

ng-class在h1内部无法正常工作?

来自分类Dev

斯威夫特:为什么我的-1按钮无法正常工作?

来自分类Dev

WebBrowser1_DocumentCompleted 事件无法正常工作

来自分类Dev

Google 地图在 Ionic v1 中无法正常工作

来自分类Dev

角$ watch无法正常工作?

来自分类Dev

UIView动画无法正常工作?

来自分类Dev

jQuery的动画无法正常工作

来自分类Dev

动画UIView无法正常工作

来自分类Dev

jQuery动画无法正常工作

来自分类Dev

jQuery动画无法正常工作

来自分类Dev

jQuery的动画无法正常工作

来自分类Dev

for循环动画无法正常工作?