[英]Why doesn't my angular controller function get called?
泽HTML:
<body ng-app="ReporterApplication" ng-controller="BootstrapController as bootstrap">
<div><% boostrap.user %></div>
<div id="pagePreloader"></div>
<div ng-if="!bootstrap.user.logged" ng-controller="LoginController as login" class='site-wrapper-login'>
<form role="form" name="login" class="form-login">
<div class="logo-wrapper">
<img class="logo" src="/resources/images/logo.png">
<div class="logo-text">
<div class="reporter">Reporter</div>
<div class="application">Internal Application</div>
</div>
</div>
<div class="icon-input large">
<i class="icon fa fa-user"></i>
<input ng-model="login.username" type="text" name="reg_username" class="input-text" id="username" placeholder="Enter Username">
</div>
<div class="icon-input large">
<i class="icon fa fa-lock"></i>
<input ng-model="login.password" type="password" name="reg_password" class="input-text" id="password" placeholder="Enter Password">
</div>
<button class="button full large" ng-click="login.submit()">Login</button>
</form>
</div>
并且回顾JS:
Application.controller('LoginController', ['$scope', 'ServerActions', function($scope, ServerActions)
{
console.log('WE LOGIN!');
var login = this;
login.username = "";
login.password = "";
login.submit = function () {
console.log('SUBMIT');
ServerActions.fetchData('login.action', {username: login.username, password: login.password}).then(
function (response) {
console.log('SUBMIT SUCCESS');
}
);
}
}]);
由于某种原因,我的提交函数没有被调用。 这是为什么? 我究竟做错了什么? 为什么上帝恨我!?!??! 控制器堆叠有什么干扰我期望代码工作的方式吗?
<form name=login>
这实际上是从表单元素创建一个全局变量name
,因此它与您给控制器的名称冲突。 从表单中删除名称:
<div ng-controller="LoginController as login" class='site-wrapper-login'>
<form role="form" class="form-login">
</form>
</div>
或者将控制器重命名为变量:
<div ng-controller="LoginController as loginCtrl">
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.