今天完成的事情：

改js5使用jq进行表单验证为angular表单验证。

熟悉，实践angular表单，输入验证的写法，多种指令和用法

明天的计划：

完成任务7，继续学习angular的事件，控制器，http等用法。

遇到的问题：

1 正则表达式在实际代码中的写法：

ng-pattern="^([A-Za-z0-9\S]){5,16}$">

上图代码无法起作用，正则表达式写完后需要转义：

ng-pattern="/^([A-Za-z0-9\S]){5,16}$/">

不能少了那两个斜杠。

2 表单验证的标准写法，引入ng-message后使用的一些指令：

<input type="text" placeholder="用户名" id="name"
       maxlength="16"
       name="userName"
       ng-model="user.userName"
       ng-minlength="5"
       required
       ng-pattern="/^([A-Za-z0-9]){5,16}$/"
>

3 提示框会改变页面的布局：

<div class="remind-box">
    <div class="remind" ng-messages="userForm.userName.$error" ng-if="userForm.userName.$touched">
        <p ng-message="minlength">账号长度最少为5</p>
        <p ng-message="required">必须填写账号</p>
        <p ng-message="pattern">账号为英文字母或者数字</p>
    </div>
</div>

由于angular设置的时提示框dispaly：none，在现实不同的提示时，会将布局弄乱，可以在外层设置一个div，并限定高度。

收获：

更熟悉angular的写法，套路了。