私はjQuery UIを使用して私のビューに接続ul
リストの束を持っています:リスト項目のドラッグアンドドロップと並べ替えを容易にするSortable指示。Angular.js:既存のスコープデータに基づいてng-repeatsを再レンダリングすることは可能ですか?
私はjQueryのUIのドラッグを経由して行うことと私は$apply
機能を使用して$scope
に適用されますドロップの変更、この部分が動作する...
私は今に実行している問題は、しかし、これらのリストの一部にドロップに私が提供するということですユーザーが記入する必要があるカスタムフォーム。
ユーザーがオプションがあります:代わりに$apply
を呼び出すのキャンセルボタンをクリックし
- は、その後 に
$apply
呼び出しが$scope
- にデータを永続化しないどのフォームに必要事項を記入し、継続を最後のドラッグ・アンド・ドロップのやり取りを元に戻し、すべてのリストをこの段階でまだ
$scope
にあるデータを反映するように効果的に再レンダリングする必要があります(最新のドラッグがまだ影響を与えていないためです)。
この「キャンセル」ボタンの効果は、ユーザーがリストアイテムをピックアップして別のリストにドラッグする前にすべてのポイントを効果的に元に戻すことです。
ng-repeat
を強制的にリフレッシュまたは再レンダリングして、現在の$scope
データを視覚的にリフレッシュして表示するにはどうすればよいですか?ユーザーがフォームに入力を開始すると、私は
$scope.oldData = angular.copy($scope.data);
はその後、彼が好きなようフォームを使用して、ユーザ編集の$ scope.dataを聞かせて設定します
AngularJSの内部では、通常、データモデル($ scope)を変更するだけで動作します。外部で行われた場合、$ scope。$ apply()を呼び出すと更新/リフレッシュが開始されます。キャンセル処理の最後に、$ scope。$ apply()を呼び出すか、変更を$ scopeにラップしますか?$ apply(function(){... changes changes ...})? –
私は実際に '$ scope.apply()'をjQueryベースのディレクティブの中から呼び出していますが、既存のデータの再ロード/再レンダリングを強制しないようです。おそらく、Angularはすべてがまったく同じだと思っているので、DOM操作をしてくれた私がそれについて話すことなく知らなかったでしょう。ですから、私が実際に必要とするのは、 '$ 'スコープに関係なくAngularがレンダリングされたデータの更新を強制する' force refresh'タイプの呼び出しです。 – Jannis
まあ、考えられる回避策として、$ scopeの呼び出しの中で$ scopeからドラッグされた項目を削除するとどうなるでしょうか?$ apply() - Angularはそれを見て再レンダリングします。 。$ apply()call)$ timeout()を使ってもう一度それを追加してください: '$ timeout(function(){...ここで$ scopeに削除された項目を戻します。}};' $ timeout関数は2番目のレンダリングを起こさせるはずです。 –