javascript - 使用 javascript 的 Angular ng-animate 未按预期工作

Question

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

这里是小提琴...

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();
        });
    }
}
});

Answer 1

jQLite 不包括 animate() 方法。在包含 Angular 之前，您需要正确包含 jQuery，并且您的代码可以正常工作。因此，只需在包含 AngularJS 的脚本标记之前添加以下内容：

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

更新了 jsFiddle