angular.js - Angular の双方向バインディングが壊れています!

Question

最初にコードを貼り付けます:

コントローラー:

リーリー

ディレクティブ:

リーリー

html:

リーリー

効果:

折りたたんだ状態

展開時

予備提出が完了しました。私の期待は次のとおりです:

展開されたら、折りたたまれた領域をクリックして元に戻し、scope.isFold 折りたたみフラグを変更して元の状態に戻します。

質問は次のとおりです:

バグが発生します。つまり、scope.isFold の値を変更し、scope の値が変更されたことを確認しましたが、元の値がまだページ上にあります。つまり、双方向バインディングが無効です。下の写真をご覧ください

画像の表示では、折りたたみ領域が折りたたまれています。以下のscope.isFoldの出力も通常のtrueですが、dom要素を確認したところ、正しい値になっています。コントローラーを確認しました。ディレクティブのscope.isFoldの値は正しいです。この状況は非常に憂鬱です。 。 。

Answer 1

$scope.$apply

をイベント ハンドラー関数に追加します

Answer 2

リーリー

js

リーリー

Answer 3

解決策は次のとおりです:

dom 要素を操作し、スコープの属性値を変更した後、scope.$apply によってビューが更新されます

リーリー

Answer 4

実際、多くの人が誤解をしています。つまり、リンク関数で elemnet.on のイベント監視をまだ使用しています
ngClick を使用して、リンクにscope.click 関数を記述してみてはいかがでしょうか。

サードパーティの jQuery プラグインを使用しない限り