Studied a morning, and finally made a real-time access to local localstorage to simulate registration login ~ ~ ~
<! DOCTYPE html>
<meta charset= "UTF-8";
<title> We're poor, though. , but we have a dream </title>
<script src= "Angular.js" ></SCRIPT>
<body ng-app= " Zcsapp "ng-controller=" Zcscontrol ";
User name: <input type=" text "ng-model=" name "/><BR>
Secret code: <input type= "text" ng-model= "pwd"/><BR>
Confirm password: <input type= "text" ng-model= "Pwd2"/> <br>
<input type= "button" value= "register" ng-click= "Zhuce ()"/>
<input type= "button" value= "Log In" Ng-click= "Enter ()"/>
<span style= "color:red" >{{MESSAGE}}</SPAN>
</body>
< Script>
//var data={"name": "admin", "pwd": "N"};
function Personalinfo (name,pwd) {
This.name=name;
This.pwd=pwd;
}
personalinfo.prototype.savalocalstorage= function () {
var storage=window.localstorage.getitem ("Personalinfo");//The data obtained is a string
Storage=json.parse (storage) | | [];//string converted to Object
Storage.push (this);
Window.localStorage.setItem ("Personalinfo", Json.stringify (storage));
};
personalinfo.selectbyname= function (name,pwd) {
var storage=window.localstorage.getitem ("Personalinfo");
storage= storage? Json.parse (storage): [];
Return Storage.some (function (v) {//Returns a Boolean value
return v.name===name&& v.pwd;
})
};
personalinfo.prototype.hasname= function (name,pwd,fn,fn2) {
var storage=window.localstorage.getitem ("Personalinfo");//The data obtained is a string
storage= storage? Json.parse (storage): [];
var data=storage;
for (Var i=0;i<data.length;i++) {
var v=data[i];
if (name!==v.name&& pwd!==v.pwd) {
FN ();
Return
}
};
};
Angular.module ("Zcsapp", [])
. Controller ("Zcscontrol", ["$scope", function ($scope) {
$scope. zhuce= function () {
$scope. message= "";
var name= $scope. Name;
var pwd= $scope. pwd;
var pwd2= $scope. Pwd2;
If the input is empty or undefined
if (name===undefined| | Name.trim (). length===0| | pwd===undefined| | Pwd.trim (). length===0| | pwd2===undefined| | Pwd2.trim (). length===0) {
$scope. message= "Please enter full information";
Return
}
If the password entered is inconsistent with the confirmation password
if (PWD!==PWD2) {
$scope. message= "Two input passwords are inconsistent";
Return
}
Judging whether the local already has this name
if (Personalinfo.selectbyname (name,pwd)) {
$scope. message= "This account is registered";
Return
}
Storing information
var data=new personalinfo (NAME,PWD);
Data.savalocalstorage ();
};
$scope. enter= function () {
$scope. message= "";
var name= $scope. Name;
var pwd= $scope. pwd;
var per=new personalinfo (NAME,PWD);
if (personalinfo.selectbyname (name)) {
$scope. message= "Log in Success";
Return
}
Per.hasname (Name,pwd,function () {
$scope. message= "Account error or password is incorrect"
});//get Log in information
}
}])
</script>
Real-time acquisition of local localstorage data using angular to achieve a simulated background data login effect