Угловая страница для входа

Я работаю на странице входа в систему. В соответствии с требованием я создал пользовательский интерфейс входа в систему. Теперь я пытаюсь проверить имя пользователя и пароль. Поскольку я новичок в Angular и Web Api, я не могу получить правильный результат через свой код. Возможно, я совершил несколько глупых ошибок.

HTML-код

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.22/angular.min.js"></script>
<!DOCTYPE html>
<html lang="en">
<head>
<title>Project</title>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,user-scalable=0">
<meta name="description" content=""/>
<meta name="keywords" content=""/>
<link rel="stylesheet" href="../content/bootstrap.min.css">
<link rel="stylesheet" href="../content/font.css">
<link rel="stylesheet" href="../content/Project.css">
 <script src="../scripts/jquery-1.9.1.min.js"></script>
 <script src="../scripts/bootstrap.min.js"></script> 
    <script src="../controllers/login.js"></script>
 </head>

<body style="background:url(../images/login_bg.jpg) no-repeat center center fixed; background-size:cover;">
<div class="container" ng-app="myApp" ng-controller="login">
  <div class="row">
    <div class="col-md-6 col-xs-offset-3"> <a href="#"><img src="../images/logo.png" style="left:38%;" class="login_logo"></a>
      <div class="regs">
     <center>
 <h3>Login to Project</h3>
</center>
   <form id="form-login_v2" method="post" action="" class="form-horizontal">
      <input type="hidden" name="login" value="yes">
      <div class="row">
<div class="clearfix"></div>
          <div class="col-md-12 col-sm-12 col-xs-12">
            <label for="email">Email</label>
      <div class="form-group ">    
            <div class="input-group ">
              <div class="input-group-addon"> <i class="glyphicon glyphicon-envelope"></i> </div>
              <input class="form-control" id="email"
                               name="email"
                               type="text"
                               data-validation="[EMAIL]" ng-model="email">

            </div>
          </div>
          </div>

          <div class="col-md-12 col-sm-12 col-xs-12">
           <label for="password" style="display:block;">Password <strong class="pull-right"><a href="#" class="">Forgot Password ?</a> </strong></label>
      <div class="form-group ">

          <div class="input-group col-md-12 col-xs-12 col-sm-12">
              <div class="input-group-addon"><i class=""><i class="glyphicon glyphicon-asterisk"></i></div>
              <input class="form-control" id="password"
                               name="password"
                               type="password"
                               data-validation="[NOTEMPTY]" ng-model="password">

            </div>
          </div>
          </div>

          <div class="col-md-12 col-sm-12 col-xs-12">

      <div class="form-group " style="margin-bottom:5px;">


 <button type="submit" class="btn btn-primary pull-right" ng-click="login">Login</button>
          </div>
          </div>
          </div>


    </form>

      </div>
      </div></div>
    </div> 

</body>
</html>

.фрагмент кода cs

  [HttpGet]
    [Route("api/Project/ValidateLogin/{email}/{password}")]
    //e.g http://localhost:66574/api/Project/ValidateLogin/ABC@GMAIL.COM/TEST123
    public bool ValidateLogin(string email, string password)
    {
        return bal.ValidateLogin(email, password);
    }

угловой код js я пробовал

angular.module('myApp', [])
  .controller('login', ['$scope',
    function ($scope) {

        $scope.login = function () {
            $scope.dataLoading = true;
            AuthenticationService.Login($scope.email, $scope.password, function (response) {
                if (response.success) {
                    AuthenticationService.SetCredentials($scope.email, $scope.password);
                    $location.path('/');
                } else {
                    $scope.error = response.message;
                    $scope.dataLoading = false;
                }
            });
        };

    }
  ]);

1 ответ

  1. Прежде всего удалите из тега метод POST ..причина это огонь обратной стороны вашей страницы я думаю (и это не goos для СПА).
    Andif вы хотите проверку.. qhy вы не используете проверку HTML5..поэтому для вашего поля электронной почты сделайте что-то вроде:

     <input class="form-control"   id="emailTxt"
                                   name="email"
                                   type="email"
                                   required
                                   ng-model="email">
    

    И для пароля

    <input class="form-control" id="password"
                                   name="password"
                                   type="password"
                                   data-validation="[NOTEMPTY]" ng-model="password">
    

    И, возможно, проверить ваш угловой контроллер

    if(password && email){ // ...}