angular.js - angular1.x,dom操作與ng資料操作的衝突問題

Question

http://codepen.io/anon/pen/JXogBj?editors=1010

如上面的程式碼所示，
點擊1:dom操作再點擊2:ng操作，標籤的值沒改，除非點擊3:ng操作再點擊2:ng操作。
有什麼方法可以讓2:ng操作總是生效？

Answer 1

先說明原因

• 1:dom操作，直接改變的View值，但是$scope.name還是123，沒有改變，這點很重要

• 2:ng操作，因為$scope.name還是123，這時候賦值123，其實什麼都沒乾

• 3:ng操作，$scope.name賦值124，這時候name改變了，angular回去更新view的值，因為值是一樣的所以看不出來效果。再點選2:ng操作，$scope.name賦值123，改變了會同步更新view的值。

有點繞

補充

var helloApp = angular.module("helloApp", []);
helloApp.controller("HelloCtrl", function($scope) {
  $scope.name = "123";  
  
  $('#domopr').click(function(){
    $scope.$apply(function(){
       $scope.name = "124";
    });
  });
});