1
私はangularjsを初めて利用しています。私は簡単なログインページを作成しました。コードは正常に動作していますが、検証と資格情報には問題があります。私はいくつかのサイトでいくつかの手がかりを見つけましたが、それらの回答は私の解決策に適切な情報を提供していません。私が直面しているエラーは、バリデーションです。無効なmailidとパスワードを入力すると、エラーメッセージがポップアップするはずです。しかし、私はそれを達成できませんでした。anglejsを使用したログインの検証と資格情報
HTML:
`<form ng-submit="loginform()" class="ng-scope ng-pristine ng-valid center" name="logform"><br/><br>`
<div class="form-group col-md-4">
<label form="emailinput"><b>Email</b></label>
<input type="email" class="form-control" name="uname" id="emailinput" placeholder="[email protected]" ng-model="username" ng-pattern="emailFormat">
<span ng-show="logform.uname.$dirty.username && loginform.uname.$invalid"></span>
<span style="color: Red" ng-show="logform.uname.$valid">* Email is required</span>
<span style="color: Red" ng-show="logform.uname.$error.username">* Invalid ID </span>
</div>
<div class="form-group col-md-4">
<label form="pwdinput"><b>Password</b></label>
<input type="password" class="form-control" name="pwd" id="pwdinput" placeholder="*******" ng-model="password">
<span style="color: red" ng-show="logform.pwd.$dirty && loginform.pwd.$invalid"></span>
<span ng-show="logform.pwd.$error.$valid">* Password is required</span>
<span ng-show="logform.pwd.$error.pwd">* Invalid Password</span>
</div>
<div class="col-md-4">
<button type="cancel" class="btn" ng-click="toggle_cancel()">Cancel</button>
<button class="btn btn-primary" ng-click="submit()" ng-Disabled="logform.username.$dirty && loginform.username.$invalid || logform.pwd.$dirty && loginform.pwd.$invalid">Login</button>
</div>
AngularJs:
`var app = angular.module('logapp',['toastr']);`
app.factory('authentication', function() {
return {
isAuthenticated: false,
user: null
}
});
app.controller('credientials', function($scope,toastr,authentication) {
$scope.loginform = function (username, password) {
if ($scope.username === '[email protected]' && $scope.password === '123') {
authentication.isAuthenticated = true;
$location.path("/home");
} else {
toastr.error('Invalid username and password');
}
};
});