I’m a newbie, I’ve been playing angular recently. . . I encountered a problem while writing a small demo: Why did the binding event of the directive become invalid after I added the controller? . . Ask for answers. . .
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
<script src="js/angular.min.js" type="text/javascript"></script>
<script src="js/directives.js" type="text/javascript"></script>
<!--<script>
var app=angular.module('mySystem',[]);
app.controller("test",function ($scope) {
$scope.logState=false;
})
</script>-->
</head>
<body ng-app="mySystem">
<form role="search" ng-controller="test" >
<p class="form-group" >
<input type="text" class="form-control" placeholder="用户名" ng-model="userName">
<input type="text" class="form-control" placeholder="密码" ng-model="passWord">
</p>
<button type="submit" class="btn btn-default" login-check>登录</button>
</form>
<p>{{logState}}</p>
</body>
</html>
var app=angular.module('mySystem',[]);
app.directive("loginCheck",function () {
return{
restrict:"A",
link:function (scope, element, attrs) {
element.bind('click',function () {
alert('click');
})
}
}
});
Just add a click binding event to the button in the form. If I had not added ng-controller=“test” when adding the form at the beginning, this directive could be triggered successfully, but after adding it, it would not work. . . What is the reason? Does Angular's form have a default method or something (just a wild guess)? Ask God for help. . . .
![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
Okay. I found the answer myself. . . As long as the directive is written after the controller, this problem will not occur. . . I'm still looking for answers as to why. Everyone is welcome to comment or provide answers!
---------------------------------I am the dividing line------------------ ------------------
Found the reason. . . My understanding of the module is wrong and this question can be closed. . .