Ember.js：动画删除/删除一个项目或记录

我在Ember 1.13，using ember-liquid-fire其他一些东西，但有了这个，我想通过淡入淡出或滑动删除一个记录。就在现在，它立即消失，这有点刺耳。Ember.js：动画删除/删除一个项目或记录

以下是UI;模板只是使用{{#each}}帮手迭代模型

这里是我的删除操作：

delete: function(item) { 
    this.get('model').removeObject(item); 
    item.destroyRecord(); 
}

有人建议在其他地方使用{{liquid-bind}}，但我不知道在哪里把它放在我的标记中，因为我使用的是桌子，而{{each}}包装了<tr>，所以如果我把液体助手放在那里，那么就有div作为我的桌子的孩子而不是行。

如果有人知道如何做到这一点（使用液体火或其他方式），我很想知道！

来源

2017-03-01 redOctober13

绑定物品应该改变以触发液体火灾。

请看看this twiddle

来源

2017-03-01 20:23:06

如果我只是使用div，而不是表格，这可能会很好，但现在它并没有真正的帮助。谢谢你尝试。 – redOctober13

，而不是试图使用液体火，我就用animate.css的简单途径。

为此，我必须为我的表格行创建一个组件。 liquid-fire插入divs，这当然会弄乱桌子布局。

在我的部分，我只是添加了动画类，并在动画完成后，发送动作删除的项，像这样：

//components/table-record.js 
actions: { 
    handleDelete(item) { 
     this.$().addClass('animated zoomOut'); 
     this.$().one('webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend', 
     () => { 
      this.sendAction('deleteAction',item); 
     } 
    ); 
    } 
    }

的全部细节见this twiddle。

来源

2017-03-01 21:34:59 redOctober13

Ember.js：动画删除/删除一个项目或记录

回答

相关问题