angular.js - angularjs ng-animate在ng-repeat情況下不起作用問題
問題描述
想要達到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是對的么?我怎么看到語法是:
那怎么著也應該是:
.repeated-item{ border: solid 1px; opacity: 1; transition: all 3s linear;}回答2:
同問,求大神
回答3:repeat的動畫是從無到有,加個按鈕把數據寫到items里面應該就可以有動畫了
相關文章:
1. javascript - webpack熱加載配置不生效2. css3 - 這個右下角折角用css怎么畫出來?3. debian - docker依賴的aufs-tools源碼哪里可以找到啊?4. mysql - eclispe無法打開數據庫連接5. windows2003下的apache響應時間特別長?6. javascript - 在 model里定義的 引用表模型時,model為undefined。7. 關于Java引用傳遞的一個困惑?8. java - 根據月份查詢多個表里的內容怎么實現好?9. javascript - 一個關于客戶端和前端通信的疑惑?10. php - 一個操作請求多個服務如何保證數據的安全?
