Javascript 如何在指令中捕获复选框事件?

Javascript 如何在指令中捕获复选框事件?,javascript,angularjs,angular-directive,Javascript,Angularjs,Angular Directive,我是Angular的新手,希望在指令中调用并捕获复选框事件(选中/未选中)。因此,这意味着当有人选中复选框时,它应该调用链接| controller中的某些代码/函数;理想情况下,在指令的控制器中避免使用$watch。以下是我目前得到的信息: <!-- this reside in a different view under some controller called 'myCtrl' --> <input my-directive type="checkbox">

我是Angular的新手,希望在指令中调用并捕获复选框事件
(选中/未选中)
。因此,这意味着当有人选中复选框时,它应该调用
链接| controller
中的某些代码/函数;理想情况下,在指令的控制器中避免使用$watch。以下是我目前得到的信息:

<!-- this reside in a different view under some controller called 'myCtrl' -->
<input my-directive type="checkbox">  

angular.module('myApp').directive('myDirective', function () {

   var directive = {};

   directive.restrict = 'A';

   directive.controller = ['$scope', '$rootScope', function ($scope, $rootScope) {
        // maybe capture checkbox event here

   }];

   directive.compile = function () {

       var linkingFunction = function (scope, element, attributes, ngModel) {

       // or capture event here and do some logic 
       // logic might look like below in pseudo code
       if (input element is checked ) {
           do something 
           also store the capture value in a variable i.e. `checked`
       } 

       if (input is uncheched) {
           then do this other thing 
           also store the capture value in a variable i.e. `unchecked`
       } 
       };

       return linkingFunction;
   };

   return directive;
});

角度.module('myApp')。指令('myDirective',函数(){
var指令={};
directive.restrict='A';
directive.controller=['$scope','$rootScope',函数($scope,$rootScope){
//可能在这里捕获复选框事件
}];
directive.compile=函数(){
var linkingFunction=函数(范围、元素、属性、模型){
//或者在这里捕获事件并执行一些逻辑
//伪代码中的逻辑可能如下所示
if(选中输入元素){
做点什么
还将捕获值存储在变量中,即“选中”`
} 
如果(输入未勾选){
然后做另一件事
还将捕获值存储在变量中,即“未选中”`
} 
};
返回链接功能;
};
返回指令;
});
理想情况下,我希望在选中和未选中每个
事件时调用此指令,并捕获事件值,但主要关注的是在选中复选框时调用此指令


有人能告诉我怎么做吗?

您尝试执行的指令已经存在并且被调用

只需将其设置为您的复选框:

<input type="checkbox" ng-change="yourController.reactOnChangedValue($event)">

检查给定的URL,他们有一个例子,应该足以满足您的目的


如果你仍然坚持自己写,看看吧。只需根据您的需要调整它。

您尝试执行的指令已经存在,并且被称为

只需将其设置为您的复选框:

<input type="checkbox" ng-change="yourController.reactOnChangedValue($event)">

检查给定的URL,他们有一个例子,应该足以满足您的目的


如果你仍然坚持自己写,看看吧。根据您的需要调整它。

为什么不考虑
ngModel
内部指令上的
watcher
?简单的解决方案,您尝试做的绝对不是简单的解决方案为什么不考虑
ngModel
内部指令上的
watcher
,你试图做的绝对不是一个简单的解决方案。我总是喜欢注意到,在复选框上,我注意到ng变化是命中或未命中的,所以如果你遇到麻烦,你可以尝试ng单击。我总是喜欢注意到,在复选框上,我注意到ng变化是命中或未命中的,所以如果你遇到麻烦,你可以尝试ng单击。