如何处理删除DOM效果？

问题描述：

{{#if boolean}} 
    {view MyView}} 
{{/if}}

我可以很容易地添加，当元件被插入到DOM的一个不错的动画：

MyView: { 
    didInsertElement: function() { 
    this.$().hide().show('slide', {direction: 'left', duration: 2000}); 
    } 
}

然而，相同的从DOM中删除元素时无法完成：

MyView: { 
    willDestroyElement: function() { 
    this.$().hide('slide', {direction: 'right', duration: 2000}); 
    } 
}

这不起作用，因为该元素是基于条件tha t超出了这个视图的控制，元素立即从DOM中被移除。异步动画从不运行。

处理这个问题的最佳方法是什么？

D你最终解决这个问题？ – 2013-04-21 19:35:23

不幸没有:( – bcardarella 2013-04-21 21:42:27

还没有进展？ – shime 2013-10-25 11:34:32

答

对于一个简单的情况，您可以将您的布尔值绑定到您的视图并观察它，手动隐藏和显示视图，但否则将其留在DOM中。

答

为什么不按照你的看法做这样的事情？

booleanChanged: function() { 
    var boolean = this.get('controller.boolean'); 
    if (boolean) { 
    this.$().hide().show('slide', {direction: 'left', duration: 2000}); 
    } else { 
    this.$().hide('slide', {direction: 'right', duration: 2000}); 
    } 
}.observes('controller.boolean')

，只是在你的handelbar使用

{view MyView}}

答

这是一个哈克解决方案，但对我的作品：

willDestroyElement: -> 
    element = @$().clone() 
    @$().replaceWith element 
    element.slideUp 250, -> 
    element.remove()

基本上，克隆的DOM元素，让灰烬破坏元素与视图相关联，并使用克隆进行动画（在动画完成后肯定会销毁克隆）

如何处理删除DOM效果？

相关推荐