5

由于@ghemton 的safeClone方法，我已经能够让 jQuery UI Sortable 在 Ember.js 中工作：Ember.js + jQuery UI Draggable Clone

排序完成后，我无法让 Ember 知道更改。现在，我按照将数组元素从一个数组位置移动到另一个位置中的splice建议使用将集合中的项目移动到适当的位置。这很好，但我遇到了窗口滚动的问题。

在这个 jsfiddle http://jsfiddle.net/chrisconley/g4aE6/中，如果滚动到底部，然后重新排序任何元素，窗口会跳回顶部。如果在propertyWillChangeand之间放置一个断点propertyDidChange，您可以看到 Ember 正在暂时从视图中删除所有项目，这导致窗口跳回顶部。

App.MySortableView = Em.CollectionView.extend({
  moveItem: function(fromIndex, toIndex){
    var items = this.get('content');
    this.propertyWillChange('content');
    item = items.splice(fromIndex, 1)[0];
    items.splice(toIndex, 0, item);
    this.propertyDidChange('content');
  }
});

有没有办法在不删除和替换整个集合的情况下通知 Ember 更改？

更新的解决方案：

（感谢克里斯托弗斯瓦西在下面的回答）

App.MySortableView = Em.CollectionView.extend({
  moveItem: function(fromIndex, toIndex){
    var items = this.get('content');
    item = items.objectAt(fromIndex);
    items.removeAt(fromIndex);
    items.insertAt(toIndex, item);
  }
});

此处的完整示例：http: //jsfiddle.net/chrisconley/NN35P/

4

1 回答 1

4

你不应该对像 Array 这样的对象使用 JS 标准库调用。这些调用不能被 Ember 的绑定/观察者捕获。而是使用 Ember 定义的 API，例如 'replace'、'objectAt' 等来与数组交互。

在这种情况下，您需要将#splice 替换为#replace。

于 2012-04-25T14:00:36.760 回答