angular對html原生的form做了封裝，增加了很多驗證功能
1.代碼結構
<form name="signup_form" novalidate ng-submit="signupForm()">
<div>
<label>用戶名</label>
<input type="text" placeholder="Name" name="name" ng-model="signup.name" ng-minlength=3 ng-maxlength=20 required />
<div class="error" ng-show="signup_form.name.$dirty && signup_form.name.$invalid">
<small ng-show="signup_form.name.$error.required">姓名必填</small>
<small ng-show="signup_form.name.$error.minlength">姓名最少三個字符</small>
<small ng-show="signup_form.name.$error.maxlength">姓名最多20個字符</small>
</div>
</div>
<div>
<label>密碼</label>
<input type="text" placeholder="Name" name="name" ng-model="signup.name" ng-minlength=3 ng-maxlength=20 required />
<div class="error" ng-show="signup_form.name.$dirty && signup_form.name.$invalid">
<small ng-show="signup_form.name.$error.required">密碼必填</small>
<small ng-show="signup_form.name.$error.minlength">密碼最少三個字符</small>
<small ng-show="signup_form.name.$error.maxlength">密碼最多20個字符</small>
</div>
</div>
<button type="submit" ng-disabled="signup_form.$invalid" class="button radius">提交</button>
</form>
2.如果要使用angular的表單驗證，首先要確保表單必須要有一個name的屬性所有的輸入字段都可以進行基本驗證，比如最大，最小長度等。這些功能都由H5的表單屬性提供，如果想要屏蔽瀏覽器對於表單默認的驗證行為，可以在表單上添加novaildate的標記。
3.h5的驗證
必填項：驗證表單輸入是否已經添加 之前在dom元素上加上required標記即可
<input type="text" required/>
最大/小長度：驗證表單輸入的文本是否小/大於某個最小值，可以在輸入的字段上使用指令 ng-maxlength="{number}"/ng-minlength="{number}"
<input type="text" ng-minlength="5" ng-maxlength="15"/>
電子郵件:驗證輸入的文本是否是電子郵箱可以使用 type=email來實現
<input type="email" name="email" ng-model="user.email" />
是否數字:驗證輸入的文本是否是為數字可以使用 type=number來實現
<input type="number" name="age" ng-model="user.age" />
URL:驗證輸入的文本是否是為url可以使用 type=url來實現
<input type="url" name="homepage" ng-model="user.homepage" />
4.angular內置的驗證指令
匹配模式：使用ng-pattern="/PATTERN/"來確保輸入能匹配指定的正則表達式
<input type="text" ng-pattern="[a-zA-Z]"/>
5.表單的屬性
表單的屬性可以在所在作用域的$scope對象中訪問到，而我們又可以訪問$scope對象因為JavaScript可以間接地訪問dom中的表單屬性借助這些屬性，我們可以對表單做出實時的響應（雙向綁定）這些屬性
1:未修改的表單 這是一個布爾類型的屬性，用來判斷用戶是否修改了表單，如果未修改，值為true否則為false formName.inputfieldName.$pristine 2:修改過的表單 只要用戶修改過表單無論輸入是否驗證通過都返回true formName.inputfieldName.$dirty 3:合法的表單 這個布爾屬性用來判斷表單的內容是否不合法，如果當前的表單內容是合法的。該屬性就返回為true formName.inputfieldName.$valid 4：不合法的表單 這個布爾屬性用來判斷表單的內容是否不合法，如果當前的表單內容是不合法的，該屬性就返回為true formName.inputfieldName.$invalid 5：錯誤 這是angular提交的另一個非常有用的屬性：$error對象，她包含當前表單所有的驗證內容。以及它們是否合法的信息，可以這樣來訪問formName.inputfieldName.$error,如果驗證失敗這個屬性值為true，如果值為false說明通過了驗證。