发表于: 2018-10-20 23:35:22

1 271


今天完成的:

   前台“修改密码”、“实名认证”、“银行卡绑定”的表单验证、http请求等。


明天计划的:

   “更换手机”、银行卡绑定/解绑、“我的理财”,以及其他页面的假数据渲染。

     现在感觉只是单纯的数据请求/渲染、写写事件还是比较简单,涉及表单验证的时候稍有点懵了。。

     (忽然感觉css样式也有点烦 ( *⊙~⊙) )


遇到的问题:

   错误信息提示的写法、正则卡了一下。关于ng-show和ng-message掌握的不熟练。

   通过ng-disabled使按钮禁用遇到问题:实名认证的前两个页面禁用都实现了,然后第三个页面基本照着第二个写的,按钮还是禁用不掉。然后耗了挺久在排查问题,最后发现是将input框绑定上ng-model就可以了(红字)

<form name="verify3Form" novalidate>
   <div class="verify_tip">
    本次操作需要短信验证,请输入138XXXX8888收到的短信验证码。
  </div>
   <div class="verify_code lineHeight_34" style="display: flex;">
      <span style="flex: none">验证码:</span>
      <input type="text" class="form-control" placeholder="请输入短信验证码" onkeyup="this.value=this.value.replace(/\D/g,'')" onafterpaste="this.value=this.value.replace(/\D/g,'')" autocomplete="off" ng-model="smsCode" ng-minlength="6" maxlength="6" required>
      <button style="flex: none; margin-right: 10px;" class="btn btn-default">重发验证码</button>
   </div>
   <div class="sms_tip">
      <p>60s后可重新获取</p>
   </div>
   <div>
      <button type="submit" class="complete_verify next_step"ng-disabled="verify3Form.$invalid" ng-click="verifyDone()">下一步</button>
   </div>
</form>

    

今日收获:

  var reg =  /(?!^(\d+|[a-zA-Z]+|[~!@#$%^&*?]+)$)^[\w~!@#$%^&*?]{7,20}$/;
  这个正则表达式规定了必须包括字母数字特殊字符中任意2种组合。


  ng-message的简单应用:

<p ng-message="required">邮箱必填</p>

<p ng-message="minlength">邮箱长度太短</p>

<p ng-message="maxlength">邮箱长度太长</p>

<p ng-message="email">邮箱无效</p>

 有个问题,就是 ng-show 或者 ng-message 可不可以对文档中的两个值进行比较然后得出 true 或 false 来进行展示或隐藏。在写修改密码那块的时候有个校验是要两次新密码输入一致,想着能不能将两个双向绑定的值作为表达式在 ng-show 中校验是否相等,不过没能实现。还是说只有自带的那些  $invalid  $valid  $pristine  $ dirty 什么的。




返回列表 返回列表
评论

    分享到