Question

简单示例：

  <body ng-app="testApp">
    <form name="myForm" id='CtrlHost' ng-controller="Ctrl">
        <input type="Button" value="Change Inside Angular" ng-click="ChangeIt()" />
        <input type="Button" value="Change Outside Angular" onclick="OutsideAngularChange()" />
      </form>
  </body>

angular.module('testApp', [])
    .controller('Ctrl', function($scope, MyService) {
        var NewPropValue = 1;
        $scope.ChangeIt = function () {
            alert("scope.changeit called");
              NewPropValue++;
              MyService.SetMyProp(NewPropValue);
        };
        $scope.$watch(MyService.GetMyProp, function (newValue) {
            alert("NewValue from Watch = " + newValue);   
        });
    }).service('MyService', function () {
       var myProp;

        this.GetMyProp = function () {
            return MyProp;
        };

        this.SetMyProp = function (newProp) {
            MyProp = newProp;   
        };
    });

function OutsideAngularChange() {
                  alert("OutsideAngularChange called")
    angular.element(document.getElementById('CtrlHost')).scope().ChangeIt();
}

http://jsfiddle.net/jonnyknowsbest/4umxanpu/

点击“Change Inside Angular”按钮，触发范围监视。点击“更改外角度”按钮，不会触发范围监视。

两个按钮都调用相同的范围方法来更新服务属性。

一个人如何工作，一个人不工作？

Answer 1

在更改值后尝试使用$ scope。$ apply（）。

https://docs.angularjs.org/api/ng/type/$rootScope.Scope#$apply

Answer 2

你回答了自己的问题。 $ watches仅在$ digest（）内部调用。这是“内角”的定义。由于您的电话是在$ digest（）或“outside angular”之外进行的，因此不会评估任何观察者。

您可以通过多种方式手动触发摘要，但

angular.element(document.getElementById('CtrlHost')).scope().ChangeIt();

angular.element(document.getElementById('CtrlHost')).scope().$apply();

可能是最合适的。

从外角调用示波器功能不会触发手表

2 个答案: