AngularJS觀看輸入有效性指令

Question

我喜歡觀看指令內輸入元素的有效性。我的控制器始終是undefined。我如何在輸入元素上觀看$valid，$invalid等屬性？

app.directive("myElement", function() 
{ 
    return { 
     restrict: "A", 
     templateUrl: "./Templates/tooltip.html", 
     scope: { 
     }, 
     compile: function (element, attrs) { 
      return { 
       pre: function preLink(scope, element, attrs, controller) { 
       }, 
       post: function postLink(scope, element, attrs, controller) { 
        scope.$watch(function(){return controller.$invalid;},function(newVal,oldVal){ 
        }); 
       } 
      } 
     } 
} 

Answer 1

對於（前，後， - ）的controller參數鏈接功能工作，你必須需要一個或多個控制器：

return { 
    require: "ngModel", 
    ... 
}; 

或多項：

return { 
    require: ["ngModel", "foo", "bar"], 
    ... 
}; 

雖然這並不能解決您的問題;您需要在指令中定義一個控制器，並確保該模板的根元素是，其命名形式爲。所以，你可以這樣做：

模板：

<form name="theForm"> 
    <input name="myInput" ng-model="foo.name" /> 
</form> 

指令：//文檔：

return { 
    controller: function($scope) { 
     $scope.watch("theForm.myInput.$valid", function(isValid) { 
      ... 
     }); 
    }, 
    ... 
};