使用javascript的角度ng-animate无法按预期工作

时间:2013-04-10 14:50:42

标签: javascript angularjs ng-animate

我尝试使用JS实现演示示例但是ng-switch出了问题......我可以看到dom中添加了新元素,但ng-switch并没有删除不需要的DIV。你可以帮忙......

以下是 Fiddle...

var ngModule = angular.module('myApp', []);
ngModule.animation('js-wave-enter', function () {
return {
    setup: function (element) {
        //prepare the element for animation
        element.css({ 'position': 'absolute', 'left': '100%' });
    },
    start: function (element, done, memo) {
        //start the animation
        element.animate({ 'left': 0  }, function () {
            //call when the animation is complete
            done();
        });
    }
}
});

ngModule.animation('js-wave-leave', function () {
return {
    setup: function (element) {
        //prepare the element for animation
        element.css({'position': 'absolute',  'left': 0     });           
    },
    start: function (element, done, memo) {
        //start the animation
        element.animate({ 'left': '-100%'      }, function () {
            //call when the animation is complete
            done();
        });
    }
}
});

1 个答案:

答案 0 :(得分:2)

jQLite不包含animate()方法。在包含Angular之前,你需要包含jQuery,你的代码才能正常工作。因此,只需在包含AngularJS的脚本标记之前添加以下内容:

<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>

Updated jsFiddle