问题标签 [angular-ui-sortable]

有没有办法用angular ui的可排序设置回调函数？我想将 ng-update="foo()" 添加到下面的 tbody 标记中，并在列表更改时运行 foo 。

谢谢！

我正在使用 ui.sortable 来显示可重新排序的项目列表。我得到这样的数据：

我使用cachedRules这样我可以将正在重新排序的数组与原始数组进行比较，并检测是否进行了更改。我的观点是这样的：

每当重新排序某些内容时，都会调用此代码，以便RuleSequence更新（我在 OrderBy 中使用的内容）：

如果 的顺序与$scope.rules不同，则启用“保存”按钮cachedRules。这一切都完美无缺。

但是，我想要一个“取消”按钮，单击该按钮会将页面上的显示恢复为原始顺序。鉴于我存储了原始数据的副本，这应该很容易，我使用 ng-click 来做$scope.rules = cachedRules.slice();，但是在我这样做之后，页面上的订单并没有更新，即使$scope.rules回到它的状态，它也保持在它的更改状态不变的状态。我怎样才能让显示器恢复到原来的顺序？

对于一个项目，我想使用 Angular 和 ui-sortable 来对列表进行排序，分为行和列。它不是表格，而是我想使用 div，使用引导类添加行和 col-md 类以显示为表格。我制作了一个类似于我想要实现的功能的代码笔。行可以通过拖放进行排序，但有点麻烦。但在一行中，我无法更改列的排序顺序。

我正在使用的codepen示例：我希望能够更改元素A | B 到 B | A.而且我也希望能够移动A | B 下 C | 乙

我将 AngularJs 与 Ui-sortable ( https://github.com/angular-ui/ui-sortable ) 一起使用。我的用例基本上是在同一个列表中拖放。

通常的拖放列表项目（我的意思是，更新项目的位置）是有效的。当我尝试添加 Ajax 调用以检查是否允许移动时，我的问题就出现了。如果不允许移动，则应取消。取消是我不能很好地运行的部分。

也许使用一些代码更容易理解：

关于如何处理它的任何建议？

我一直在挖掘 SO 和其他帖子，但无法使其工作。我有一个列表，我用 ng-repeat 对其进行迭代并对其应用一些过滤器。当列表的索引未更改时，ui-sortable 可以很好地工作，但只要索引更改（通过过滤器），过滤后的列表就不会反映排序顺序。这是jsfiddle：http: //jsfiddle.net/hKYWr/1996/

我希望我的过滤列表在我进行排序后立即得到更新。有什么帮助吗？

我有两个连接的 ui-sortable 列表。当其中一个列表为空时，我需要显示一条消息；当该空列表在拖动时悬停时，我需要显示一个样式化的放置目标并隐藏空列表消息。我能够编写绝大多数代码，这是一个简化的 Codepen 工作。

错误是，当您从填充列表中拖动到空列表上然后再次拉出时，空列表会同时显示空列表占位符和样式化放置目标。这是一个屏幕截图：

问题的根源似乎在于我计算 sortableList 指令的列表是否为空：

请注意，我正在跟踪范围内的状态并使用 $apply 来确保 DOM 更新如下：

这是指令模板的 html：

依赖项列表对于 codepen 的工作来说相当长，我从实际生产代码中简化了代码，消除依赖项会使自定义代码变得相当可观。如果您想尝试自己运行它，这里有一个依赖项列表：jquery、jquery-ui、angular、bootstrap、lodash 和 sortable from angular-ui。那里也有一些很棒的字体。

当前元素（div）被放置在图像的左侧。有没有办法在它们之间没有多余空间的情况下订购它们（如图像右侧）？

这是我的 ui-sortable 设置：

我有这个json结构：

我正在尝试使用 angularjs ui.sortable 添加排序行为。我希望类别和项目都是可排序的。

我基于这个 json 创建了两个嵌套的有序列表，但我不知道如何解决可排序的设置。这个json结构可以吗？

通过这些设置，我只解决了分类排序工作。问题是当项目被移动（错误的位置或未定义的位置）。

更新： 这是我的代码： http ://codepen.io/anon/pen/LpGmeY 保持 json 不变的解决方案对我来说是完美的，但如果不可能，我会接受任何其他解决方案。

我用文件夹和子文件夹实现了某种 FilePanel。

从 Chrome 开发人员工具中，我可以看到它ui.item.sortable.droptarget的data属性为parent-folder-id == 2，但是当我尝试在代码中（通过 jquerydata方法）访问它时，它返回 10（我最近所在的另一个文件夹的父级的值）。为什么它没有得到更新？当我移动到另一个文件夹时 -vm.parentId根据该文件夹的服务器值分配新值。DOM 已正确更新...

稍后添加：即使我将 .data() getter 更新为ui.item.sortable.droptarget.data("parentFolderId")它仍然返回10

更新 2：添加了 plunker 演示： http ://plnkr.co/edit/14XfBOTFuJZ0oSy2ozqh?p=preview

应用程序.js

当您单击此序列中的按钮时：Set - Get-data值成功更新。但是，当您单击另一个序列时：Get - Set - Get- 出现与我之前的代码相同的问题 - 在获取值时使用新值更新值后 - 旧值返回。

在我的应用程序中，我有一个ItemsService从服务器获取项目并将它们作为 JSON 对象存储在其cache变量中的。项目可以出现在许多地方，例如表格或图形/图表等。

例如，当我初始化 a table- 我只需要从中选择特定项目cache，例如 1st、3rd、7th。

如何实现它们之间的双向连接？基本上我想table包含对特定项目的引用，cache因此当我更改项目时cache，table它的状态将一直保持同步，因为它是同一个项目。

此外，当我从中删除项目时table- 它需要从cache.

这是table和cache结构的示例：

桌子：

ItemsService 缓存（简化版）：

物品结构：

还需要指出我使用angular-ui-sortable插件来允许在列/行之间拖动项目，并且我需要提供ng-model数组（我认为）。这是它现在的样子：