Angularjs修改密码的实例代码


Posted in Javascript onMay 26, 2017

修改密码逻辑思维

首先要输入旧的密码,判断旧的密码是否正确(后台判断)

其次输入新的密码,判断新密码格式(可增加)

最后判断新密码和确认密码输入是否一致

html部分

<form class="form-horizontal" role="form">
 <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.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>确认新密码</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()">保存设置</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修改密码的实例代码,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
offsetParent 算法分析
Apr 05 Javascript
JavaScript快速检测浏览器对CSS3特性的支持情况
Sep 26 Javascript
简单谈谈javascript代码复用模式
Jan 28 Javascript
全系IE支持Bootstrap的解决方法
Oct 19 Javascript
常见JS验证脚本汇总
Dec 01 Javascript
AngularJS 服务详细讲解及示例代码
Aug 17 Javascript
微信小程序 video详解及简单实例
Jan 16 Javascript
js实现按座位号抽奖
Apr 05 Javascript
canvas简单快速的实现知乎登录页背景效果
May 08 Javascript
解读vue生成的文件目录结构及说明
Nov 27 Javascript
javascript填充默认头像方法
Feb 22 Javascript
傻瓜式解读koa中间件处理模块koa-compose的使用
Oct 30 Javascript
详解vue.js的devtools安装
May 26 #Javascript
详解Vue.js基于$.ajax获取数据并与组件的data绑定
May 26 #Javascript
vue.js获取数据库数据实例代码
May 26 #Javascript
详解通过JSON数据使用VUE.JS
May 26 #Javascript
JS中去掉array中重复元素的方法
May 26 #Javascript
React Js 微信禁止复制链接分享禁止隐藏右上角菜单功能
May 26 #Javascript
AngularJS表单验证功能分析
May 26 #Javascript
You might like
PHP中数组的三种排序方法分享
2012/05/07 PHP
使用PHP进行微信公众平台开发的示例
2015/08/21 PHP
PHP 二维数组和三维数组的过滤
2016/03/16 PHP
解决PHP Opcache 缓存刷新、代码重载出现无法更新代码的问题
2020/08/24 PHP
五种js判断是否为整数类型方式
2015/12/03 Javascript
js实现的彩色方块飞舞奇幻效果
2016/01/27 Javascript
AngularJS实践之使用ng-repeat中$index的注意点
2016/12/22 Javascript
浅析BootStrap中Modal(模态框)使用心得
2016/12/24 Javascript
用nodeJS搭建本地文件服务器的几种方法小结
2017/03/16 NodeJs
nodejs使用express创建一个简单web应用
2017/03/31 NodeJs
Vue实现搜索 和新闻列表功能简单范例
2018/03/16 Javascript
JS端基于download.js实现图片、视频时直接下载而不是打开预览
2020/05/09 Javascript
JavaScript 接口原理与用法实例详解
2020/05/12 Javascript
python中的__init__ 、__new__、__call__小结
2014/04/25 Python
解决windows下Sublime Text 2 运行 PyQt 不显示的方法分享
2014/06/18 Python
详解django自定义中间件处理
2018/11/21 Python
Python使用paramiko操作linux的方法讲解
2019/02/25 Python
PyTorch: 梯度下降及反向传播的实例详解
2019/08/20 Python
Python类及获取对象属性方法解析
2020/06/15 Python
pycharm激活方法到2099年(激活流程)
2020/09/22 Python
M1芯片安装python3.9.1的实现
2021/02/02 Python
Python tkinter之ComboBox(下拉框)的使用简介
2021/02/05 Python
详解CSS3选择器的使用方法汇总
2015/11/24 HTML / CSS
canvas进阶之如何画出平滑的曲线
2018/10/15 HTML / CSS
html5跳转小程序wx-open-launch-weapp踩坑
2020/12/02 HTML / CSS
美国木工工具和用品商店:Woodcraft
2019/10/30 全球购物
关于VPN
2012/06/10 面试题
英语文学专业学生的自我评价
2013/10/31 职场文书
合作协议书
2014/04/23 职场文书
保护环境的标语
2014/06/09 职场文书
艺术学院毕业生求职信
2014/07/09 职场文书
校庆团日活动总结
2014/08/28 职场文书
活动主持人开场白
2015/05/28 职场文书
Python获取百度热搜的完整代码
2021/04/07 Python
5道关于python基础 while循环练习题
2021/11/27 Python
MongoDB支持的数据类型
2022/04/11 MongoDB