anglejsのログインページでパスワードが間違っているメッセージ

Question

管理ポータルのログインページで、入力したパスワードが間違っていると、適切なエラーメッセージが表示されます。私はAngularJSでページを開発しました。 AngularJSで既にこれを行っている人は、私を助けてください。

ログイン機能

$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

のログインページのHTML

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

スクリプトちょっとそれは、ログインページで、検証のための完全なチュートリアルだ、限り形状誤差が行くようにhttps://scotch.io/tutorials/angularjs-form-validation-with-ngmessages

Answer 2

をご覧くださいメッセージを調べる必要があります。https://scotch.io/tutorials/angularjs-form-validation-with-ngmessages

例：一方

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

サーバーからの角度に送信され、「間違ったパスワード」エラーを処理する方法を意味している場合、私はtoastrを使用してお勧めします。

簡単でカスタマイズ可能です。あなたはただそれをインストールして、それを注入する必要があります： https://github.com/Foxandxss/angular-toastr

jsであなたはエラーをチェックするでしょう。おそらく、約束の後.catch（）で、または条件付きますが、応答OBJにエラーメッセージを送信している場合：

$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); 
    });  
} 

はあなたがCONSOLE.LOGすることもできます（「データ」を、データ）を最初に表示しますアラートウィンドウ内に表示したい文字列の場所です。これはdata.messageなどにある可能性があります。

また、おそらく$ rootscope（悪い習慣と見なされます）を使用することになるかもしれません。

新しいバージョンの角度では、.success/.errorは使用されず、エラーの場合は.then（）と.catchだけが使用されます。