javascript - angularjs：在指令中使用 $watch 来调用服务

Question

我正在创建一个与输入框进行两天绑定的指令。

一个 $watch 被放置在链接函数中（我不知道这是否是一个好主意）来观察输入框中的值。

看起来 scope.$watch 根本没有做任何事情。

我无法弄清楚问题是什么，因为我试图从

scope.$watch('var',srv.doStuff(),true);

至

scope.$watch('location',srv.doStuff(),true);

还是没有运气。

谢谢大家

http://plnkr.co/edit/4XUqPsCLFOoJD0BPlk14

索引.html

<div ng-controller="formCtrl">
<form novalidate class="simple-form">
    Input: <input type="text" ng-model="location" required><br/>
</form>
<div ng-mydir var="location"></div>
<div>

应用程序.js

var app = angular.module('plunker', []);

app.controller('formCtrl', function($scope) {
  $scope.location="empty";
});

// a service 
app.service('srv', function() {
  //a function does stuff
  this.doStuff=function (){
     console.log('i am done');
  };
});


//a diretive calls serivce
app.directive('ngMydir', function (srv) {
  return {
    restrict: 'A',
    scope: {
        var:'='
    },
    link: function(scope,elem,attrs,ctrl){
    console.log(scope.var);
    scope.$watch('var',srv.doStuff(),true);
    }
  };
});

Answer 1

您传入的srv.doStuff()是函数调用而不是实际函数，您可以使用以下解决方案之一：

srv.doStuff()在这样的函数中扭曲函数调用

link: function (scope, elem, attrs, ctrl) {
    scope.$watch('var', function () {
        srv.doStuff();
    }, true);
}

或者干脆

link: function (scope, elem, attrs, ctrl) {
    scope.$watch('var', srv.doStuff, true);
}