拥有登录表单时无法提交表单

Question

我有以下代码，但无法触发-ng-submit或ng-click，但登录按钮上的本地onclick功能除外。 如果您知道好的解决方案或能够发现问题的方法，请告诉我：

 <form ng-submit = "login.submitLoginForm(login.user)" novalidate> <p> <input class="username-email" type="email" name="username" value="" placeholder="Your Email" ng-model="login.user.userName"> </p> <p> <input class="password" type="password" name="password" value="" placeholder="Password" ng-model="login.user.pwd"> </p> <div class="checkbox"> <label> <input type="checkbox" value="">Remember me</label> </div> <p> <button class="login" type="submit" name="Login" value="Login">Login</button> </p> </form> 

  vm.submitLoginForm = submitLoginForm; function submitLoginForm(user) { // submitLoginForm... console.log("UserName..form.." + user.UserName + 'pwd..' + user.pwd); if(user.userName != '' || user.userName != 'undefined'){ vm.user.userName = user.userName; console.log("UserName..form.." + user.userName + vm.user.userName); ServiceFactory.setUserName(vm.user.userName); } if(user.pwd != '' || user.pwd != 'undefined'){ vm.user.pwd = user.pwd; console.log("UserName..pwd.." + user.pwd + vm.user.pwd); ServiceFactory.setPwd(vm.user.pwd); } initialize(); }; 

Answer 1

 'use strict'; angular .module('app', []) .controller('LoginCtrlr', LoginCtrlr); function LoginCtrlr() { var vm = this; vm.user = { userName: '', pwd: '' }; vm.submitLoginForm = function submitLoginForm(user) { // submitLoginForm... console.log("UserName..form.." + user.userName + ' vm userName: ' + vm.userName); if (user.userName != '' || user.userName != 'undefined') { vm.userName = user.userName; console.log("UserName..form.." + user.userName + ' vm. userName: ' + vm.userName); } } } 

 <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> <div ng-app="app"> <section class="container" ng-controller="LoginCtrlr as login"> <div> <p class="or">Or</p> <p class="login">your email</p> <form novalidate> <p> <input class="username-email" type="email" name="username" value="" placeholder="Your Email" ng-model="login.user.userName"> </p> <p> <input class="password" type="password" name="password" value="" placeholder="Password" ng-model="login.user.pwd"> </p> <div class="checkbox"> <label> <input type="checkbox" value="">Remember me</label> </div> <p> <button class="login" type="submit" name="Login" value="Login" ng-click="login.submitLoginForm(login.user)">Login</button> </p> <div>{{ login.message }}</div> </form> </div> <p class="note-text-center-xs">By continuing, you accept the terms of Use and Privacy Policy</p> <div class="login-help-center-xs"> <p><a href="#">Forgot your password?</a> </p> </div> <p class="no-account" onclick="#">You Don't have an account yet? Sign up</p> </a> </section> </div> 

我尝试创建完整的代码片段。 删除了依赖模块，因为并非所有人都可以通过代码片段访问。

我改变了什么：

• 定义新的“ app”模块use []（方括号）

• 将对象分配给模型时，需要调用控制器，因为您可以自行定义所有控制器的方法和属性，而不是使用$ scope。 例如：

  <input class="username-email" type="email" name="username" value="" placeholder="Your Email" ng-model="login.user.userName">