アレイの変更でNg-repeatが更新されない

Question

私はこの問題を何時間も見てきましたが、まったく同じように見える他の多くの質問を読んだことがあります。

私はオブジェクトの配列（instructionObj.instructions）を持っていて、それらのオブジェクトはng-repeatで繰り返され、それらのテンプレートは指令です。

<div instruction-directive ng-repeat="i in instructionsObj.instructions"> </div> 

次に、Jquery UIをソート可能にしてアイテムを並べ替えることができます。

var first, second; 
$(".sort").sortable({ 
    axis: "y", 
    start: function(event, ui) { 
     first = ui.item.index(); 
    }, 
    stop: function(event, ui) { 
     second = ui.item.index(); 
     console.log(first + " " + second); 
     rearrange(first, second); 
     $scope.$apply(); 
    } 
}); 

私は、オブジェクトの開始と終了インデックスは移動してアクセスし、それに応じて配列を並べ替える：このすべては、ほとんどの時間を素晴らしい作品

function rearrange(f, s){ 
    $timeout(function() { 
     $scope.instructionsObj.instructions.splice(s, 0, 
      $scope.instructionsObj.instructions.splice(f, 1)[0]); 
     $scope.$apply(); 
    }); 
} 

。私が失敗したシナリオは、オブジェクトを並べ替えるときです（1つの列が画面に表示されるすべてのオブジェクトの現在の位置です）：

a | b | c | d | a

b | c | d | c | b

c | d | b | b | d

d | | | | c

最後のステップはa、d、c、bでなければなりません。しかしそれはa、b、d、cに変わります。

しかし、私は戻って私の前のビューに戻り、正しい設定が表示されて戻ってきたときに、すべてが順調です。あなたが見る通り、私は$timeoutと$apply()と他の多くのものを試しましたが、どれもうまくいかないようです。

私は配列をログに記録することができ、DOMが表示しているものと違っている（正しい）ことを確認できます。どんな助けもありがとう。

アップデート：私も、配列の正確なレイアウトを表示するために<pre ng-bind="instructionsObj.instructions|json</pre>を使用していますが、それは常に正しい

。私の心は吹かれた。

Answer 1

私は解決策を見つけましたが、なぜ問題が起こったのか分からないにもかかわらず、解決策が見つかりました。この中

はJS：

sortableEle = $('.sort').sortable({ 
    start: $scope.dragStart, 
    update: $scope.dragEnd 
}); 

$scope.dragStart = function(e, ui) { 
    ui.item.data('start', ui.item.index()); 
} 
$scope.dragEnd = function(e, ui) { 
    var start = ui.item.data('start'), 
     end = ui.item.index(); 

    $scope.instructionsObj.instructions.splice(end, 0, 
     $scope.instructionsObj.instructions.splice(start, 1)[0]); 
    currentRecipe.setInstructions($scope.instructionsObj.instructions); 
    $scope.$apply(); 
    sortableEle.refresh(); 
} 

私は配列を変更した後sortableEle.refresh()として$scope.$apply()同様を呼び出すために必要な。

また、私はなぜそれが時間の10％を台無しにするのか分からないが、それを修正した。

FYI：ソート可能な関数を少し変更しましたが、前と同じ正確な処理を行います。