AngularJS拖拽排序后如何获取模型数组？

其实很简单——ui-sortable会自动帮你同步ng-model绑定的数组，拖拽完成后，hiringstagelist本身就是排序后的最新状态，你不需要额外去“获取”，直接用就可以了。下面给你两种常用的场景示例：

1. 在拖拽完成的回调里直接使用 #

你可以在sortableOptions里配置update或者stop事件回调，在拖拽动作完成时立刻拿到排序后的数组：

$scope.sortableOptions = {
  // update事件在排序发生变化时触发
  update: function(e, ui) {
    // 这里的$scope.hiringstagelist就是刚排序好的数组
    console.log('排序后的招聘阶段列表:', $scope.hiringstagelist);
    // 比如你要提交到后端，直接传这个数组就行
    $scope.saveSortedStages($scope.hiringstagelist);
  },
  // stop事件在拖拽完全结束（鼠标松开）时触发
  stop: function(e, ui) {
    console.log('拖拽结束后的最终列表:', $scope.hiringstagelist);
  }
};

2. 在其他作用域内直接访问 #

只要是在AngularJS控制器的作用域里，任何时候你需要用到这个列表，直接访问$scope.hiringstagelist就可以——因为拖拽后的数组变化已经通过双向数据绑定同步到了作用域中。比如你可以加个按钮，点击后获取当前排序：

$scope.getLatestSortedList = function() {
  console.log('当前最新排序的列表:', $scope.hiringstagelist);
  return $scope.hiringstagelist;
};

原理补充 #

ui-sortable和ng-model绑定后，拖拽操作会直接修改绑定的数组对象，AngularJS的双向数据绑定机制会自动把这个变化同步到作用域中，所以你不需要手动去从DOM里提取数据，直接用作用域里的hiringstagelist就完全没问题。

内容的提问来源于stack exchange，提问作者Shalini Raj