Angularjs登录应用程序？

Question

I want to make a login page in angular.. I don't know how to compare the entered value with hard coded value? 我想创建一个角度登录页面。我不知道如何比较输入值和硬编码值？ I am attaching my code here, help by rewriting the code of controller.js 我在这里附加我的代码，通过重写controller.js的代码来提供帮助

 var app = angular.module('loginApp',[]) app.controller("FormController",function($scope){ $scope.details=[ { name:"Shrey@gmail.com", password:"password" }, { name:"amcd@gmail.com", password:"password" } ] $scope.login=function($scope){ $scope.email=''; if ($scope.details.name==$scope.email && ){ console.log("Entered"); } else{console.log("wrong");} } })

 <!DOCTYPE html> <html ng-app="loginApp"> <head> <title>TO DO List</title> <link href="css/bootstrap.css" rel="stylesheet" /> <link href="css/bootstrap-theme.css" rel="stylesheet" /> <script src="lib/angular.min.js"></script> <script src="js/controller.js"></script> </head> <body> <div class="container"><h2>Login App</h2></div> <form> <div class="container" controller="FormController"> <div class="form-group"> <label>Email Address</label> <input type="email" class="form-control" ng-model="email" placeholder="Email"/> <label>Password</label> <input type="password" class="form-control" ng-model="password" placeholder="Password"/> </div> </div> <div class="container"> <button type="submit" ng-click="login()" class="btn btn-default">Submit</button> </div> </form> </body> </html>

Please help me with the controller.js 请通过controller.js帮助我

Answer 1

You need to bootstrap your Angular app properly check the below solution to check whether a match is found against the hard coded values. 您需要正确引导Angular应用程序，请检查以下解决方案，以检查是否找到与硬编码值匹配的内容。

It is a security issue to check for such sensitive data such as the password property on the client-side you should do it on the server-side. 检查此类敏感数据（例如客户端的password属性）是安全问题 ，您应该在服务器端进行检查。

 angular .module('loginApp', []) .controller("FormController", FormController); FormController.$inject = ['$scope']; function FormController($scope) { $scope.login = login; var details = [{ name: "Shrey@gmail.com", password: "password" }, { name: "amcd@gmail.com", password: "password" }]; function login() { var isMatch = false; for (var i = 0; i < details.length; i++) { if ($scope.email === details[i].name && $scope.password === details[i].password) { isMatch = true; break; } } if (isMatch) { console.log("Entered"); } else { console.log("Wrong"); } } }

 <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" /> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> <div ng-app="loginApp"> <div ng-controller="FormController"> <div class="container"> <h2>Login App</h2> <form role="form" name="loginForm" ng-submit="loginForm.$valid && login()"> <div class="form-group"> <label>Email Address</label> <input type="email" class="form-control" placeholder="Email" ng-model="email" ng-required="true" /> </div> <div class="form-group"> <label>Password</label> <input type="password" class="form-control" placeholder="Password" ng-model="password" ng-required="true" /> </div> <div class="form-group"> <button type="submit" class="btn btn-default">Submit</button> </div> </form> </div> </div> </div>

Answer 2

Please try following to resolve your issue 请尝试按照以下步骤解决您的问题

 var app = angular.module('loginApp', []) app.controller("FormCrtl", ["$scope", "$filter", function ($scope, $filter) { $scope.details = [{ name: "Shrey@gmail.com", password: "password" }, { name: "amcd@gmail.com", password: "password" }] $scope.checkLoginUser = function () { if ($filter('filter')($scope.details, { name: $scope.email, password: $scope.password }).length > 0) { console.log("Entered"); } else { console.log("wrong"); } } }]);

 <!DOCTYPE html> <html> <head> <title>TO DO List</title> <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> </head> <body ng-app="loginApp"> <div class="container" ng-controller="FormCrtl"> <h2>Login App</h2> <div> <form name="loginForm" class=" form-group"> <label>Email Address</label> <input type="email" class="form-control" ng-model="email" placeholder="Email" /> <label>Password</label> <input type="password" class="form-control" ng-model="password" placeholder="Password" /> <div class="clear"> <input type="submit" ng-click="checkLoginUser()" class="btn btn-default" value="Submit" /> </div> </form> </div> </div> </body> </html>

Angularjs登录应用程序？

问题描述

2 个解决方案

解决方案1
0 2016-11-24 10:45:06

解决方案2
0 2016-11-24 10:47:20

Angularjs登录应用程序？

问题描述

2 个解决方案

解决方案1 0 2016-11-24 10:45:06

解决方案2 0 2016-11-24 10:47:20

解决方案1
0 2016-11-24 10:45:06

解决方案2
0 2016-11-24 10:47:20