Passwort falsche Nachricht in einer Login-Seite in angularjs

Question

In einer Login-Seite für ein Admin-Portal, möchte ich entsprechende Fehlermeldung angezeigt, wenn Passwort falsch eingegeben. Ich habe die Seite in AngularJS entwickelt. Jemand, der dies bereits in AngularJS getan hat, bitte hilf mir.

HTML für die Login-Seite

<div class="wrapper"> 
    <form class="form-signin">  
    <div class="form-signin-heading"> 
    <img src="Images/wellness-India-logo_0.png"> 
    </div> 
    <input type="email" class="form-control" ng-model="user.emailid" name="username" placeholder="Email Address" required="" autofocus="" /> 
    <input type="password" class="form-control" ng-model="user.password" name="password" placeholder="Password" required=""/>  
    <label class="checkbox"> 
    <input type="checkbox" value="remember-me" id="rememberMe" name="rememberMe"> Remember me 
    </label> 
    <button id="login" class="btn btn-lg btn-primary btn-block" type="submit" ng-click="login()">Login</button> 
    <button id="clear" class="btn btn-lg btn-primary btn-block" type="reset">Clear</button> 
    </form> 
</div> 

Script für die Login-Funktion

$rootScope.login = function() { 
    $("#blockUi").modal("show"); 
    $http({ 
     method: 'GET', 
     url: $rootScope.baseUri + "/adminLogin", 
     params: { 
      email: $rootScope.user.emailid, 
      password: $rootScope.user.password 
     } 
    }).success(function (data, status, headers, config) { 
     if (!data.found) { 
      $("#blockUi").modal("hide"); 
     } else { 
      $rootScope.fromLogin = true; 
      $state.go('dashboard'); 
      $("#blockUi").modal("hide"); 
     } 
    }).error(function (data, status, headers, config) { 
    });  
} 

Answer 1

hey, es ist voll Tutorial für die Validierung in Login-Seite, Besuchen https://scotch.io/tutorials/angularjs-form-validation-with-ngmessages

Answer 2

Soweit Formfehler gehen , sollten Sie in ng-Nachrichten suchen: https://scotch.io/tutorials/angularjs-form-validation-with-ngmessages

Beispiel:

<input class="form-control input-lg" type="password" id="pw" name="pw" ng-model="user.pw" placeholder="Password" ng-minlength="8" required> 
    <div ng-if="signupForm.pw.$dirty" ng-messages="signupForm.email.$error"> 
     <div ng-message="required">Your pw address is required.</div> 
     <div ng-message="minlength">Your pw must be at least 8 characters.</div> 
    </div> 

Auf der anderen Seite, wenn Sie meinen, wie man ein „falsches Passwort“ Fehler zu behandeln, die Winkel vom Server gesendet wird, würde ich empfehlen toastr verwenden.

Es ist einfach und anpassbar. Sie müssen nur bower installieren, dann injizieren: https://github.com/Foxandxss/angular-toastr

In Ihrem js würden Sie nach einem Fehler suchen. Vielleicht in einem .catch() nach einer Zusage oder bedingt, wenn Sie eine Fehlermeldung in der Antwort obj sind zu senden:

$rootScope.login = function() { 
    $("#blockUi").modal("show"); 
    $http({ 
     method: 'GET', 
     url: $rootScope.baseUri + "/adminLogin", 
     params: { 
      email: $rootScope.user.emailid, 
      password: $rootScope.user.password 
     } 
    }).success(function (data, status, headers, config) { 
     if (!data.found) { 
      $("#blockUi").modal("hide"); 
     } else { 
      $rootScope.fromLogin = true; 
      $state.go('dashboard'); 
      $("#blockUi").modal("hide"); 
     } 
    }).error(function (data, status, headers, config) { 

     //handle error logic here: 

     //using toastr: 
     toastr.error(data); 

     //traditional alert window MAKE SURE to inject "$window" into your controller 
     $window.alert(data); 
    });  
} 

Sie (‚data‘, Daten) zuerst console.log mögen, um zu sehen genau dort, wo die Zeichenfolge angezeigt werden soll, die im Warnfenster angezeigt werden soll. Es kann in data.message, etc. sein.

Auch werden Sie wahrscheinlich für die Verwendung von $ Rootscope getadelt werden (als schlechte Praxis angesehen).

Neuere Versionen von angular verwenden nicht .success/.error, nur die .then() und ein .catch für Fehler.