ui-sortable 在 ng-model 中表现得很奇怪

Question

在我的 AngularJS 应用程序中，我创建了一个带有列表的 ui-sortable。当我尝试以不同的方式订购列表时，它表现得很糟糕。没有ng-model我没有这个问题，但是ui-sortable需要有ng-model，否则会在控制台打印错误。为什么 ng-model 会产生这个问题？我创建的模型对象有误吗？

我在thisjsFiddle 中重现了错误。

重现：将 Laurent 拖到列表底部，Laurent 将出现在中间，而不是应该出现在底部。

我希望有人可以帮助我解决这个问题。

Answer 1

这似乎是 ui-sortable 中的一个错误，您正在使用这两个库的一个非常过时的版本。 查看源代码
https://github.com/angular-ui/ui-sortable/blob/v0.0.1/src/sortable.js 并将其与您的版本进行比较 https://cdnjs.cloudflare.com/ajax/libs/angular-ui/0.4.0/angular-ui.js 经过一些调试后，您可能会注意到有

onStop = function(e, ui) {
            // digest all prepared changes
            if (ui.item.sortable.resort && !ui.item.sortable.relocate) {

              // Fetch saved and current position of dropped element
              var end, start;
              start = ui.item.sortable.index;
              end = ui.item.index();
              if (start < end)
                end--;

              // Reorder array and apply change to scope
              ui.item.sortable.resort.$modelValue.splice(end, 0, ui.item.sortable.resort.$modelValue.splice(start, 1)[0]);

            }
            if (ui.item.sortable.resort || ui.item.sortable.relocate) {
              scope.$apply();
            }
          };

删除 if 语句 start

 onStop = function(e, ui) {
            // digest all prepared changes
            if (ui.item.sortable.resort && !ui.item.sortable.relocate) {

              // Fetch saved and current position of dropped element
              var end, start;
              start = ui.item.sortable.index;
              end = ui.item.index();

              // Reorder array and apply change to scope
              ui.item.sortable.resort.$modelValue.splice(end, 0, ui.item.sortable.resort.$modelValue.splice(start, 1)[0]);

            }
            if (ui.item.sortable.resort || ui.item.sortable.relocate) {
              scope.$apply();
            }
          };

我不建议手动更改库代码，而是升级到新版本的代码，可能会有更多功能和更多错误修复。