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 相关文章推荐
innerHTML在IE中报错解决方案
Dec 15 Javascript
BootstrapTable与KnockoutJS相结合实现增删改查功能【一】
May 10 Javascript
Javascript中的arguments对象
Jun 20 Javascript
jQuery web 组件 后台日历价格、库存设置的代码
Oct 14 Javascript
jQuery ajaxForm()的应用
Oct 14 Javascript
jQuery和CSS仿京东仿淘宝列表导航菜单
Jan 04 Javascript
简单谈谈require模块化jquery和angular的问题
Jun 23 jQuery
AngularJS实现进度条功能示例
Jul 05 Javascript
Angular使用 ng-img-max 调整浏览器中的图片的示例代码
Aug 17 Javascript
Vue动画事件详解及过渡动画实例
Feb 09 Javascript
JavaScript实现选项卡效果的分析及步骤
Apr 16 Javascript
Bootstrap FileInput实现图片上传功能
Jan 28 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
德生S2000收音机更换“钕铁硼”全频扬声器
2021/03/02 无线电
shopex中集成的站长统计功能的代码简单分析
2011/08/11 PHP
PHP支持多种格式图片上传(支持jpg、png、gif)
2011/11/03 PHP
php中常用字符串处理代码片段整理
2011/11/07 PHP
利用ThinkPHP内置的ThinkAjax实现异步传输技术的实现方法
2011/12/19 PHP
使用gd库实现php服务端图片裁剪和生成缩略图功能分享
2013/12/25 PHP
PHP基于GD库的缩略图生成代码(支持jpg,gif,png格式)
2014/06/19 PHP
php通过array_merge()函数合并关联和非关联数组的方法
2015/03/18 PHP
thinkPHP5.0框架URL访问方法详解
2017/03/18 PHP
Laravle eloquent 多对多模型关联实例详解
2017/11/22 PHP
Js callBack 返回前一页的js方法
2008/11/30 Javascript
javascript制作的简单注册模块表单验证
2015/04/13 Javascript
轻量级javascript 框架Backbone使用指南
2015/07/24 Javascript
js漂浮广告实现代码
2015/08/15 Javascript
JS+CSS实现的经典圆角下拉菜单效果代码
2015/10/21 Javascript
浅析js中substring和substr的方法
2015/11/09 Javascript
详解Angularjs filter过滤器
2016/02/06 Javascript
javascript设计模式之module(模块)模式
2016/08/19 Javascript
详解Javascript中的原型OOP
2016/10/12 Javascript
浅谈jQuery绑定事件会叠加的解决方法和心得总结
2016/10/26 Javascript
基于BootStrap栅格栏系统完成网站底部版权信息区
2016/12/23 Javascript
Zepto实现密码的隐藏/显示
2017/04/07 Javascript
javascript 中的继承实例详解
2017/05/05 Javascript
python K近邻算法的kd树实现
2018/09/06 Python
python生成lmdb格式的文件实例
2018/11/08 Python
Python 存储字符串时节省空间的方法
2019/04/23 Python
分享一个python的aes加密代码
2020/12/22 Python
苏格兰领先的多渠道鞋店:Begg Shoes
2019/10/22 全球购物
印尼在线旅游门户网站:NusaTrip
2019/11/01 全球购物
Fnac西班牙官网:法国文化和电子产品零售商
2021/03/14 全球购物
大一自我鉴定范文
2013/10/04 职场文书
社区护士演讲稿
2014/08/27 职场文书
孝老爱亲事迹材料
2014/12/24 职场文书
通知函的格式
2015/04/27 职场文书
无婚姻登记记录证明
2015/06/18 职场文书
工作感言一句话
2015/08/01 职场文书