首頁 > web前端 > js教程 > 主體

如何使用Angularjs修改密碼的實例程式碼分享

黄舟
發布: 2017-05-27 13:14:56
原創
1300 人瀏覽過

這篇文章主要介紹了Angularjs修改密碼的實例代碼,非常不錯,具有參考借鑒價值,需要的朋友可以參考下

修改密碼邏輯思維

首先要輸入舊的密碼,判斷舊的密碼是否正確(後台判斷)

其次輸入新的密碼,判斷新密碼格式(可增加)

最後判斷新密碼和確認密碼輸入是否一致

html部分

<form class="form-horizontal" role="form">
 <p class="form-group">
  <label class="col-sm-2 control-label"><i class="importance">*</i>当前密码</label>
  <p class="col-sm-6">
   <input type="text" class="form-control" ng-model="user.password">
  </p>
 </p>
 <p class="form-group">
  <label class="col-sm-2 control-label"><i class="importance">*</i>新密码</label>
  <p class="col-sm-6">
   <input type="text" class="form-control" ng-model="user.newPassword" ng-minlength="8" ng-maxlength="16" required>
  </p>
 </p>
 <p class="form-group">
  <label class="col-sm-2 control-label"><i class="importance">*</i>确认新密码</label>
  <p class="col-sm-6">
   <input type="text" class="form-control" ng-model="password_again">
  </p>
 </p>
 <p class="form-group">
  <p class="col-sm-offset-2 col-sm-10">
   <button type="submit" class="btn btn-default x_submit" ng-click="changePassword()">保存设置</button>
  </p>
 </p>
</form>
登入後複製

##AngularJS部分

###########################################
.controller(&#39;userpswdCtrl&#39;, function($scope,Account,SweetAlert,$state,$localStorage){
 $scope.user = {}; //信息全部存在user里面
 $scope.changePassword = function(){
  if($scope.password_again === $scope.user.newPassword){  //如果两次密码输入一致
    $scope.user.accountId = $localStorage.accountId;   //获取用户id
    Account.modifyPassword($scope.user,function(data){  //修改密码
     console.log(data);
     SweetAlert.swal({
      title:&#39;&#39;,
      text: "修改成功",
      type: "success",
      showCancelButton: false,
      confirmButtonColor: "#DD6B55",
      confirmButtonText: "是",
      cancelButtonText: "否",
      closeOnConfirm: true,
      closeOnCancel: true
     })
    },function(){

    })
  }
 }
})
登入後複製

以上是如何使用Angularjs修改密碼的實例程式碼分享的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
最新問題
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板
關於我們 免責聲明 Sitemap
PHP中文網:公益線上PHP培訓,幫助PHP學習者快速成長!