范围.$ watch在指令链接函数中没有被调用

Joh*_*tål 7 angularjs angularjs-directive angularjs-scope

我有这个工厂,

.factory('authentication', [function() {

    return {
      loginRequired: false
    };
  }]);
Run Code Online (Sandbox Code Playgroud)

我有这个控制器,

.controller('TopNavCtrl', ['$scope', 'authentication', function($scope, authentication) {

  $scope.login = function() {
    authentication.loginRequired = true;
  };

}]);
Run Code Online (Sandbox Code Playgroud)

我在指令中有这个链接功能,

link: function(scope, element, attrs) {

    scope.show = false;

    scope.$watch(authentication.loginRequired, function(value) {
      scope.show = value;
    });
  }
Run Code Online (Sandbox Code Playgroud)

authentication.loginRequired = true;在控制器完成,scope.$watch该指令不叫.

有什么想法吗?

jus*_*sio 22

范围.$ watch接受作为第一个参数表达式或函数.作为第一个参数传递的是存储的authetication.loginRequired.

以下工作(假设您已正确注入authetication工厂):

link: function(scope, element, attrs) {

    scope.show = false;

    scope.$watch(function(){return authentication.loginRequired;}, function(value) {
      scope.show = value;
    });
  }
Run Code Online (Sandbox Code Playgroud)

  • 迈克尔,请分享你的意思.看到替代品总是好的. (4认同)

Mic*_*ord 10

跟进@ jusio的答案,只要你将工厂作为范围的一部分,它也可以使用字符串表达式:

scope.authentication = authentication;
scope.$watch('authentication.loginRequired', function(value) {
...
});
Run Code Online (Sandbox Code Playgroud)

这是因为当a $watch提供了一个字符串表达式时,它会根据其范围计算该字符串.

您应该决定是否值得混淆指令的范围,这样您就可以拥有一个更具可读性的代码.如果你出于其他原因已经这样做了,那就没什么大不了的了.