Angularjs修改密碼的實(shí)例代碼
修改密碼邏輯思維
首先要輸入舊的密碼,判斷舊的密碼是否正確(后臺(tái)判斷)
其次輸入新的密碼,判斷新密碼格式(可增加)
最后判斷新密碼和確認(rèn)密碼輸入是否一致
html部分
<form class="form-horizontal" role="form"> <div class="form-group"> <label class="col-sm-2 control-label"><i class="importance">*</i>當(dāng)前密碼</label> <div class="col-sm-6"> <input type="text" class="form-control" ng-model="user.password"> </div> </div> <div class="form-group"> <label class="col-sm-2 control-label"><i class="importance">*</i>新密碼</label> <div class="col-sm-6"> <input type="text" class="form-control" ng-model="user.newPassword" ng-minlength="8" ng-maxlength="16" required> </div> </div> <div class="form-group"> <label class="col-sm-2 control-label"><i class="importance">*</i>確認(rèn)新密碼</label> <div class="col-sm-6"> <input type="text" class="form-control" ng-model="password_again"> </div> </div> <div class="form-group"> <div class="col-sm-offset-2 col-sm-10"> <button type="submit" class="btn btn-default x_submit" ng-click="changePassword()">保存設(shè)置</button> </div> </div> </form>
AngularJS部分
.controller('userpswdCtrl', 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:'',
text: "修改成功",
type: "success",
showCancelButton: false,
confirmButtonColor: "#DD6B55",
confirmButtonText: "是",
cancelButtonText: "否",
closeOnConfirm: true,
closeOnCancel: true
})
},function(){
})
}
}
})
以上所述是小編給大家介紹的Angularjs修改密碼的實(shí)例代碼,希望對(duì)大家有所幫助,如果大家有任何疑問(wèn)請(qǐng)給我留言,小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持!
- angularjs2 ng2 密碼隱藏顯示的實(shí)例代碼
- AngularJS前端頁(yè)面操作之用戶修改密碼功能示例
- angular仿支付寶密碼框輸入效果
- 在 Angular2 中實(shí)現(xiàn)自定義校驗(yàn)指令(確認(rèn)密碼)的方法
- AngularJs驗(yàn)證重復(fù)密碼的方法(兩種)
- angularjs 表單密碼驗(yàn)證自定義指令實(shí)現(xiàn)代碼
- Angular實(shí)現(xiàn)點(diǎn)擊按鈕控制隱藏和顯示功能示例
- Angular實(shí)現(xiàn)點(diǎn)擊按鈕后在上方顯示輸入內(nèi)容的方法
- AngularJS實(shí)現(xiàn)根據(jù)不同條件顯示不同控件
- AngularJS實(shí)時(shí)獲取并顯示密碼的方法
相關(guān)文章
從源碼看angular/material2 中 dialog模塊的實(shí)現(xiàn)方法
這篇文章主要介紹了 從源碼看angular/material2 中 dialog模塊的實(shí)現(xiàn)方法,需要的朋友可以參考下2017-10-10
AngulaJS路由 ui-router 傳參實(shí)例
本篇文章主要介紹了AngulaJS路由 ui-router 傳參實(shí)例 ,小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2017-04-04
AngularJS模仿Form表單提交的實(shí)現(xiàn)代碼
本文通過(guò)一段實(shí)例代碼給大家簡(jiǎn)單介紹了angularjs模仿form表單提交的方法,非常不錯(cuò),具有參考借鑒價(jià)值,感興趣的朋友一起看看吧2016-12-12
RequireJS 依賴關(guān)系的實(shí)例(推薦)
下面小編就為大家?guī)?lái)一篇RequireJS 依賴關(guān)系的實(shí)例(推薦)。小編覺(jué)得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2017-01-01
實(shí)例詳解AngularJS實(shí)現(xiàn)無(wú)限級(jí)聯(lián)動(dòng)菜單
這篇文章主要介紹了實(shí)例詳解AngularJS實(shí)現(xiàn)無(wú)限級(jí)聯(lián)動(dòng)菜單的相關(guān)資料,需要的朋友可以參考下2016-01-01
AngularJS基礎(chǔ) ng-disabled 指令詳解及簡(jiǎn)單示例
本文主要介紹AngularJS ng-disabled 指令,這里幫大家整理了ng-disabled指令的基礎(chǔ)指令,并附示例代碼,有需要的小伙伴參考下2016-08-08

