AngularJS implements the function of user changing password

This time I will bring you AngularJS to implement the user password modification function. What are the precautions for AngularJS to implement the user password modification function? The following is a practical case, let’s take a look.

Recently I am doing front-end design. The main knowledge I use is AngularJS and nodejs for page display, data request and processing, etc. When designing a page such as a forgotten password, it is important to find an effective design idea.

Take changing the password as an example. To display the prompt information to the user in a friendly manner and clearly tell the user which part of the operation has problems, this requires defining detailed variables and functions. Display information at different locations on the page. The code below is a simple example written by myself to record the learning process.

changePwd

The code is as follows

varapp = angular.module("myapp",[]);
app.controller('changPwdCtrl',function($scope){
  $scope.name ="xiaozhang";
  $scope.pwd ="hello";
  $scope.newPwd ="hello1";
  $scope.rNewPwd ="hello2";
  $scope.submit =function(){
    $scope.reseltNotRule =''
    $scope.resultNotSame =''
    $scope.result =''
    $scope.resultSuccess =''
    if(!($scope.name&&$scope.pwd&&$scope.newPwd&&$scope.rNewPwd)){
      $scope.result ="请填写完整";
    }elseif($scope.newPwd != $scope.rNewPwd) {
      $scope.resultNotSame ="两次密码不一致";
    }elseif($scope.pwd == $scope.newPwd) {
      $scope.result ="新旧密码不能一致";
    }
  }
});

I believe you have mastered the method after reading the case in this article. For more exciting information, please pay attention to other related articles on the php Chinese website!

Recommended reading:

Summary of qps statistical methods

##Yuansheng JS realizes web page paging

Ajax processing user session failure

The above is the detailed content of AngularJS implements the function of user changing password. For more information, please follow other related articles on the PHP Chinese website!