angularjs監視控制器和指令中的服務變量變化

我一直在努力與$ watch很長一段時間。當服務中的共享變量發生變化時，我想要從控制器和指令觸發$ watch。但由於某種原因，他們不會被觸發。我是Angularjs的新手，可能對$ watch的工作原理有錯誤的理解。這是我的實驗代碼。 http://jsfiddle.net/b3A8B/84/angularjs監視控制器和指令中的服務變量變化

myApp = angular.module('myApp', []); 

myApp.directive('myDirective', ['myService', function(myService) { 
    return { 
     controller: function ($scope, myService) {  
     }, 
restrict: 'A', 
link: function(scope) { 
      $scope.$watch(function() { 
       return myService.tag; 
      }, 

      function(newVal, oldVal) { 
       console.log("Inside directive watch"); 
       console.log(newVal); 
       console.log(oldVal); 
      }, true); 

     } 
    }}]); 

myApp.service('myService', function() { 
    var tags = { 
     a: true, 
     b: true 
    }; 

    var setFalseTag = function() { 
     console.log("Within myService->setFalseTag"); 
     tags.a = false; 
     tags.b = false; 
    }; 

    return { 
      tag: tags, 
      setFalseTagA: setFalseTag 
    }; 
}); 


myApp.controller('MyCtrl', function($scope, myService) { 

    $scope.setFTag = function() { 
     console.log("Within MyCtrl->setFTag"); 
     setTimeout(function(){console.log("delay");myService.setFalseTagA();}, 2000) 
    };   

    $scope.$watch(function() { 
     return myService.tag; 
    }, 

    function(newVal, oldVal) { 
     console.log("Inside controller watch"); 
     console.log(newVal); 
     console.log(oldVal); 
    }, true); 

});

來源

2014-09-29 whitecat999

什麼是setTimeout（）？該瀏覽器的本地函數不會導致髒檢查，因此ng不會注意到該更改（直到下一個髒檢查從其他地方觸發）。

如果您刪除它，或者用$ timeout替換它（當然注入後），手錶將被觸發。

來源

2014-09-29 09:50:34

是的，使用$超時可以觸發控制器中的手錶，但不能在指令中觸發它。怎麼做？ – whitecat999 2014-09-29 10:01:26

謝謝斯蒂芬的快速回復。我將$ timeout移入服務中，然後觸發控制器中的監視，但指令仍未觸發。這是更新的代碼http://jsfiddle.net/b3A8B/96/。基本上我想要的是看到控制器和指令都能夠檢測到變化，並在服務變量發生變化時做出反應。 – whitecat999 2014-09-29 11:02:36

1）你的指令根本不用在小提琴中 - 我在HTML中添加了一個

。 2）您的代碼中存在拼寫錯誤：$ scope。指令中的$ watch（）應該是作用域。$ watch（不含前導$） – 2014-09-29 13:34:38

angularjs監視控制器和指令中的服務變量變化

回答

相關問題