使用scope。$ watch来观察函数执行的时间

Question

假设我有一个名为my-directive的自定义指令，它具有默认的范围设置（scope: false，这意味着它共享封装指令的（父）控制器的范围），我有函数my_function，附加到控制器的范围。我想知道在自定义指令的链接函数中是否可以使用scope.$watch来观察my_function何时执行？

这是一个插图代码：

<div ng-controller="MyCtrl">

    <my-directive></my-directive>

</div>

控制器：

app.controller('MyCtrl', function($scope) {

    $scope.my_function = function() {
    ...
    }

});

自定义指令：

app.directive('myDirective', function() {
    return {
        restrict: 'E',
        [scope: false,]
        ...
        link: function(scope, element, attrs) {

            // can I scope.$watch my_function here to check when it executes?

        }
    }
});

更新

我的理由是： 当my_function（实际上是$http.get的检索函数）执行时，它应该更新一个对象，比如说my_data。如果我尝试scope.$watch my_data，可能会出现my_function执行且my_data没有变化的情况（例如我在{{1}中编辑条目时无论如何都决定取消更新），因此我想在链接函数中执行的部分代码不会被执行。因此，无论是否my_data执行，我都要确保链接函数中的代码执行，无论是否有更改my_function。

Answer 1

以下是我能想到的两种解决问题的方法。

1。使用计数器

您可以在调用my_function时始终递增计数器：

// This will reside in your controller
$scope.counter = 0;
$scope.my_function = function () {
  // do your logic
  $scope.counter++;
};

// This will reside in your directive
$scope.$watch( "counter", function () {
  // do something
});

2。只需观看my_data

即可

假设my_function将总是覆盖my_data变量，您可以使用$watch的默认角度行为。您不必关心您的后端是否有新闻，参考将永远不会相同。

// in your controller
$scope.my_function = function () {
  $http.get(...).then(function ( response ) {
    $scope.my_data = response.data;
  });
};

// in your directive
$scope.$watch( "my_data", function () {
  // do something
});

显然，这是更简洁的方法，但如果您因为下列其中一项而未进行单元测试，则可能会遇到麻烦：

• 您可以在my_data周围添加任何可能与您的观察者冲突的逻辑;
• 您希望缓存HTTP调用。

---

我希望我能帮到你！祝你好运。

Answer 2

根据您尝试做的事情，您可能根本不需要$watch。

如果该功能不会改变，你可以制作一个虚拟包装。

link: function(scope, element, attrs) {

        var oldFunc = scope.my_function;
        scope.my_function = function(sameArgs){
            //method_was_called();
            if(oldFunc){oldFunc(sameArgs);}
        }

    }

然后，您可以在运行“超级”功能之前或之后，在您的包装函数中执行您想要的任何逻辑操作。方法

也检查 Javascript: Extend a Function