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 事件冒泡的介绍以及如何阻止事件冒泡
Dec 25 Javascript
利用JS进行图片的切换即特效展示图片
Dec 03 Javascript
javascript实现文本域写入字符时限定字数
Feb 12 Javascript
jQuery避免$符和其他JS库冲突的方法对比
Feb 20 Javascript
javascript实现10个球随机运动、碰撞实例详解
Jul 08 Javascript
js中document.referrer实现移动端返回上一页
Feb 22 Javascript
详解jQuery中关于Ajax的几个常用的函数
Jul 17 jQuery
浅谈react-router HashRouter和BrowserRouter的使用
Dec 29 Javascript
使用Vue父子组件通信实现todolist的功能示例代码
Apr 11 Javascript
layer关闭弹出窗口触发表单提交问题的处理方法
Sep 25 Javascript
JS合并两个数组的3种方法详解
Oct 24 Javascript
vue实现div单选多选功能
Jul 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 $_FILES函数详解
2011/03/09 PHP
php array_pop()数组函数将数组最后一个单元弹出(出栈)
2011/07/12 PHP
php中socket的用法详解
2014/10/24 PHP
Zend Framework教程之Bootstrap类用法概述
2016/03/14 PHP
php导出csv文件,可导出前导0实例代码
2016/11/16 PHP
PHP实现的数据对象映射模式详解
2019/03/20 PHP
js 实现菜单左右滚动显示示例介绍
2013/11/21 Javascript
解析JavaScript中点号“.”的多义性
2013/12/02 Javascript
Javascript图片上传前的本地预览实例
2014/06/16 Javascript
js手动播放图片实现图片轮播效果
2016/09/17 Javascript
完美实现js焦点轮播效果(一)
2017/03/07 Javascript
详解layui弹窗父子窗口之间传参数的方法
2018/01/16 Javascript
boostrap模态框二次弹出清空原有内容的方法
2018/08/10 Javascript
Vue 中的受控与非受控组件的实现
2018/12/17 Javascript
vue 设置 input 为不可以编辑的实现方法
2019/09/19 Javascript
JS实现容器模块左右拖动效果
2020/01/14 Javascript
Python中使用urllib2防止302跳转的代码例子
2014/07/07 Python
开始着手第一个Django项目
2015/07/15 Python
Tensorflow 查看变量的值方法
2018/06/14 Python
Django代码性能优化与Pycharm Profile使用详解
2018/08/26 Python
python 字典的打印实现
2019/09/26 Python
PyTorch加载预训练模型实例(pretrained)
2020/01/17 Python
wordpress添加Html5的表单验证required方法小结
2020/08/18 HTML / CSS
abstract class和interface有什么区别
2013/08/04 面试题
实习生的自我评价
2014/01/08 职场文书
低碳环保倡议书
2014/04/14 职场文书
甜品店创业计划书
2014/08/14 职场文书
2014乡镇党政班子四风问题思想汇报
2014/09/14 职场文书
交通运输局四风问题对照检查材料思想汇报
2014/10/09 职场文书
二手车交易协议书标准版
2014/11/16 职场文书
小学教师师德师风承诺书
2015/04/28 职场文书
2015人事行政工作总结范文
2015/05/21 职场文书
2015年小学二年级班主任工作总结
2015/05/21 职场文书
《称赞》教学反思
2016/02/17 职场文书
导游词之藏龙百瀑景区
2019/12/30 职场文书
PHP策略模式写法
2021/04/01 PHP