如何更新$ scope.items數組順序以響應用戶使用Angular-UI ui-sortable指令對DOM數組重新排序

Question

我在視圖中使用ui-sortable指令（來自angular-ui）

<ul ui-sortable>
  <li ng-repeat="item in items" >
     {{item.property1}}
     {{item.property2}}
  </li>
</ul>

結果，用戶可以拖放以在瀏覽器中對項目進行重新排序，但這不會更新$ scope.items數組的順序。 如何做到這一點，以使$ scope.items數組順序與瀏覽器中用戶啟動的拖放更改保持同步？

Answer 1

您正在缺少ng：model

<ul ui:sortable ng:model="list">
        <li ng:repeat="item in list" class="item">{{item}}</li>
    </ul>

請檢查以下工作示例

演示版

它顯示更新的數組

<div ng:repeat="item in list">{{item}}</div>

指令自動更新數組