Ich kann das Formular nicht senden, wenn ich das Login-Formular

Question

habe Ich habe den folgenden Code und ich bin nicht in der Lage zu triggern - ng-submit oder ng-klicken Sie auf diese Ausnahme lokale onclick Funktion auf Login-Taste. Bitte lassen Sie mich knjow, wenn Sie gute Lösung oder in der Lage kennen das Problem zu identifizieren:

<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>

Ich versuche, den vollständigen Code geschnippt zu erstellen. das Abhängigkeitsmodul wird entfernt, da nicht alle über Code-Snipped zugreifen können.

Was ich ändern:

• neu definieren ‚App‘ Modul Verwendung [] (eckige Klammer)

• Sie müssen den Controller rufen, wenn Sie ein Objekt in ein Modell sind zuweisen, da Sie Definieren Sie alle Methoden und Attribute des Controllers selbst und nicht $ scope. zum Beispiel:.

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