angular實現簡單的動態效果

簡單的記錄一下最近碰到的需求、對應的解決方法和學習狀況。

1.對一個列表實現添加、刪除、向上移動、向下移動的功能
2.在1的基礎上，向上移動和向下移動的時候要有動態的展現效果
3.添加新的對象後，頁面要顯示出來，不能手動下滑滾動條

對於一個頭腦並不聰明，入前端坑不久的人來講，我一開始是懵比的...angular要怎麼作動態效果
好在查呀查呀總能找到解決的方法,若是還有其餘方法但願大神不吝指點^.^。

首先,通過一番查找發現了angular-animate這個東西。官網上說，angular-animate爲一些指令好比 ngRepeat、ngSwitch、ngView提供了一些動畫鉤子。鉤子？..鉤子？..

好吧，最後用我愚鈍的大腦對它的理解是：若是引用了angular-animate庫，而且使用了例如ng-repeat的指令，那麼就能夠在CSS裏面使用如下這些類（即便歷來沒有定義過這些類），對元素的樣式進行控制，這可能就是鉤子的意思吧....

.xx // 元素自己的樣式，好比長寬高啊、過渡的屬性時間啦（transition: all 1s linear這個必須有，固然還能夠用animation）

// 如下的類裏面只
// 須要寫須要過渡的屬性和值
.xx.ng-enter // 元素出現時的初始狀態
.xx.ng-enter.ng-enter-active  // 元素出現完畢之後的狀態
.xx.ng-move  // 元素移動時的初始狀態
.xx.ng-move.ng-move-active  // 元素移動完畢後的狀態
.xx.ng-leave // 元素離開時的初始狀態
.xx.ng-leave.ng-leave-active // 元素離開後的狀態

放上一個簡陋的小demo，表達一下：
http://plnkr.co/edit/37reLsWM...

除了這種方法，看文檔還有其餘玩兒法，我感受就屬這個方法最容易上手啦~~
第一次寫東西，不懂得地方還不少，若是有錯誤和不足還請路過的大神指出，我會虛心改正的