Angularjs $animate.cancel没有预期的行为
我试图在最新的稳定版本1.3.2中使用angularJS的$animate:的取消功能 但要么我没有理解它应该做什么,要么它没有预期的行为: 我有这样一个自定义动画:Angularjs $animate.cancel没有预期的行为,angularjs,angularjs-animation,Angularjs,Angularjs Animation,我试图在最新的稳定版本1.3.2中使用angularJS的$animate:的取消功能 但要么我没有理解它应该做什么,要么它没有预期的行为: 我有这样一个自定义动画: var animationPromise = $animate.addClass(element, 'move-items-animation', { from: { position: 'absolute', }, to: { left : item.x + 'px', top : item
var animationPromise = $animate.addClass(element, 'move-items-animation', {
from: {
position: 'absolute',
},
to: {
left : item.x + 'px',
top : item.y + 'px'
}
}).then(function(){
element.classList.remove('move-items-animation');
});
$timeout(function(){
$animate.cancel(animationPromise); //promise.$$cancelFn is not a function`
}, 300);
这是一个基本的CSS转换。除此之外,我还有以下CSS转换:
.move-items-animation-add-active{
transition: 1s ease-in-out;
}
第一个奇怪的行为是:我得到了错误承诺。$$cancelFn不是来自
参见小提琴:
所以我稍微修改了代码:
var animationPromise = $animate.addClass(element, 'move-items-animation', {
from: {
position: 'absolute',
},
to: {
left : item.x + 'px',
top : item.y + 'px'
}
});
animationPromise.then(function(){
// After canceling this is executed
element.classList.remove('move-items-animation');
});
$timeout(function(){
$animate.cancel(animationPromise); // The animation goes on
}, 300);
现在我没有这个错误,但是动画没有停止,但是动画的回调被执行。这是否意味着我必须手动停止那里的动画
参见小提琴:
我还尝试在单独的事件中取消动画,结果相同,请参见fiddle:
所以
1.为什么第一把小提琴会出错?
2.如何实际停止动画
谢谢 它在1.4中工作,我没有看到它在1.3$animate中记录: 未记录:$animate 动画制作
实际上,我对您的库有这个问题,您的结果是唯一的:奇怪,我非常疯狂的猜测是,这与promise没有取消方法有关,angular不会将其视为$animate promise,这是唯一有取消的方法。如果您使用的是angular的非精简版本,则错误为promise。$$cancelFn不是函数,因此现在的工作方式是没有promise。$$cancelFn不再是函数错误,对吗?但在剩下的时间里,我只是用1.4测试了一下,我仍然有奇怪的行为。在Google Chrome上使用$animate.cancel跳转到动画的结尾,而在Firefox上,它似乎没有任何效果。