简单的记录一下最近碰到的需求、对应的解决方法和学习情况。
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...
除了这种方法,看文档还有其他玩儿法,我感觉就属这个方法最容易上手啦~~
第一次写东西,不懂得地方还很多,如果有错误和不足还请路过的大神指出,我会虚心改正的
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。