AngularJS v1.2 ngAnimate和ngView

Question

我想知道爲什麼這不起作用像例外。只需嘗試淡入/進出ng視圖的內容。沒有用css3動畫做很多事情。也許我的想法有錯誤。

請看看這個Link（Plunker）

Answer 1

好吧，我想我想通了。 該指令已更改。點擊此處查看文檔：

http://code.angularjs.org/1.2.0rc1/docs/api/ngAnimate

這裏是一個分叉plunkr演示：

http://plnkr.co/edit/MJZhZW2gCrTBE5XWWJEj?p=preview

Answer 2

首先，在angular 1.2中ng-animate指令被棄用。你可以簡單地把你想要的課程放在那裏。所以我們做了一個名爲pageFade類，看起來像：

.pageFade.ng-enter, .pageFade.ng-leave{ 
//transition styles 
} 

.pageFade.ng-enter{ 
opacity: 0; 
} 
.pageFade.ng-enter-active{ 
opacity:1; 
} 

.pageFade.ng-leave{ 
opacity:1; 
} 
.pageFade.ng-leave-active{ 
opacity:0; 
} 

然後，在視圖中：

<div ng-view class="pageFade"></div> 

Answer 3

對於那些誰可能有我創造的ngView如何過渡一個簡單的演示同樣的問題動畫。看看這個demo project。

總之你基本上只需要使用ng-enter，ng-enter-active，ng-leave，ng-leave-active班CSS定義動畫規則。還要記住將ngAnimate依賴項包含到您的模塊中。

希望它可以幫助別人。