您的位置:首页技术文章
文章详情页

angular.js - angularjs ng-animate在ng-repeat情况下不起作用问题

浏览:61日期:2024-09-28 16:37:02

问题描述

想要达到ng-repeat时ng-enter,ng-leave时延迟或者一些背景动画的显示,进一步使用ng-enter-stagging,让多项不同时显示出来,但是在ng-repeat构建列表时动画都没有展示。查不到问题,找了很多demo来试,都没有办法。下面是HTML代码:

<pre><p ng-repeat='item in items' class='repeated-item'> {{ item}}</p></pre>

下面是css代码:

.repeated-item{ border: solid 1px; opacity: 1; transition:3s linear all;}/*动画开始前*/.repeated-item.ng-enter, .repeated-item.ng-move { -webkit-transition:3s linear all; -moz-transition:3s linear all; -o-transition:3s linear all; background-color: red; opacity:0;}

试过把动画加到.repeated-item上去,还是不起效。请各位老师帮忙解答一下!麻烦大家了!

问题解答

回答1:

你确定你的transition是对的么?我怎么看到语法是:

angular.js - angularjs ng-animate在ng-repeat情况下不起作用问题

那怎么着也应该是:

.repeated-item{ border: solid 1px; opacity: 1; transition: all 3s linear;}回答2:

同问,求大神

回答3:

repeat的动画是从无到有,加个按钮把数据写到items里面应该就可以有动画了

相关文章: