Question

我正在使用Sortable库（https://github.com/RubaXa/Sortable）在两个列表（模型）之间创建拖放关系。为了清楚起见，让我们调用一个SourceModel和DestinationModel。

将项目从SourceModel拉到（并克隆）到DestinationModel。删除到DestinationModel中的项目使用ng-repeat（DestinationModel中的listItem跟踪$ index）呈现，该索引由索引跟踪。

我遇到的问题是当你克隆项目时，任何相同类型的克隆都是“数据绑定的”，所以因为我使用contenteditable来操作对象，所以所有的对象都是相同类型的更改，包括原始类型。（因此后续的那种类型的拖拽也会改变）

你可以在这里看到问题：

binding issue

在此会话期间拖入了两个顶级组件，当您更改一个组件时，您将同时更改这两个组件。但是，页面加载中已经存在的对象没有绑定，因此不会随着其他两个更改而改变。

保存配置并刷新后，由于项目是按索引跟踪的，所以一切都可以独立完成。

我已经尝试使用Sortable中的onAdd（）回调来添加项目的深层副本，但这不起作用。

onAdd: function (e, c) {
    c = angular.copy(c);
},

我还尝试通过强制数组通过以下函数“清理”hashkeys模型：

model.cleanseStack = function() {
  stack = JSON.parse(angular.toJson(stack));
};

然而，我也没有太多运气 - 对象仍然受约束。

如何确保打破对象之间存在的数据绑定。我仍然需要在标记和模型之间独立绑定，但是，它们不应该绑定在一起。

注意：我没有使用jQuery。最多，我可以访问jqlite作为AngularJS框架的一部分。

Answer 1

这是在Sortable库中修复的：