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 相关文章推荐
jquery 操作表格实现代码(多种操作打包)
Mar 20 Javascript
javascript各浏览器中option元素的表现差异
Apr 07 Javascript
仿jQuery的siblings效果的js代码
Aug 09 Javascript
JavaScript 布尔操作符解析  &amp;&amp; || !
Aug 10 Javascript
ECMAScript6的新特性箭头函数(Arrow Function)详细介绍
Jun 07 Javascript
javascript使用正则表达式检测IP地址
Dec 03 Javascript
使用js画图之画切线
Jan 12 Javascript
jQuery实现点击后标记当前菜单位置(背景高亮菜单)效果
Aug 22 Javascript
jQuery中ztree 点击文本框弹出下拉框的实例代码
Feb 05 Javascript
JavaScript文件的同步和异步加载的实现代码
Aug 19 Javascript
vue+element-ui表格封装tag标签使用插槽
Jun 18 Javascript
Vue项目打包编译优化方案
Sep 16 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基于curl实现模拟微信浏览器打开微信链接的方法示例
2019/02/15 PHP
TP5框架简单登录功能实现方法示例
2019/10/31 PHP
AutoSave/自动存储功能实现
2007/03/24 Javascript
Javascript匿名函数的一种应用 代码封装
2010/06/27 Javascript
Js(JavaScript)中,弹出是或否的选择框示例(confirm用法的实例分析)
2013/07/09 Javascript
javascript校验价格合法性实例(必须输入2位小数)
2014/05/05 Javascript
jQuery使用drag效果实现自由拖拽div
2015/06/11 Javascript
Bootstrap CSS组件之导航条(navbar)
2016/12/17 Javascript
jQuery插件Echarts实现的渐变色柱状图
2017/03/23 jQuery
详解webpack 配合babel 将es6转成es5 超简单实例
2017/05/02 Javascript
JavaScript操作文件_动力节点Java学院整理
2017/06/30 Javascript
使用 jQuery 实现表单验证功能
2017/07/05 jQuery
vue项目国际化vue-i18n的安装使用教程
2018/03/14 Javascript
js闭包学习心得总结
2018/04/17 Javascript
微信小程序之onLaunch与onload异步问题详解
2019/03/28 Javascript
详解微信UnionID作用
2019/05/15 Javascript
js实现贪吃蛇游戏(简易版)
2020/09/29 Javascript
[02:09]EHOME夺得首届辉夜杯冠军—现场颁奖仪式
2015/12/28 DOTA
[01:13:17]Secret vs NB 2018国际邀请赛小组赛BO2 第二场 8.19
2018/08/21 DOTA
[41:17]完美世界DOTA2联赛PWL S3 access vs CPG 第二场 12.13
2020/12/17 DOTA
python用来获得图片exif信息的库实例分析
2015/03/16 Python
详解Python进程间通信之命名管道
2017/08/28 Python
Flask框架WTForm表单用法示例
2018/07/20 Python
python如何实现代码检查
2019/06/28 Python
Python 使用folium绘制leaflet地图的实现方法
2019/07/05 Python
python之pexpect实现自动交互的例子
2019/07/25 Python
程序员的七夕用30行代码让Python化身表白神器
2019/08/07 Python
python已协程方式处理任务实现过程
2019/12/27 Python
使用tensorflow实现VGG网络,训练mnist数据集方式
2020/05/26 Python
CSS3制作炫酷的下拉菜单及弹起式选单的实例分享
2016/05/17 HTML / CSS
详解HTML5.2版本带来的修改
2020/05/06 HTML / CSS
澳大利亚领先的在线美容商店:Facial Co
2017/10/22 全球购物
司机职责范本
2014/03/08 职场文书
卫生系统先进事迹
2014/05/13 职场文书
无罪辩护词范文
2015/05/21 职场文书
html5实现点击弹出图片功能
2021/07/16 HTML / CSS