自定義過濾器
angular.module('filterApp',[])
.filter('myFilter',function(){
return function(input){
/* input就是需要過濾的內(nèi)容 */
}
})
表單驗證
input上所有的驗證項:
1. 必填項
驗證某個表單輸入是否已填寫,只要在輸入字段元素上添加HTML5標記required即可:
<input type="text" required />
2. 最小長度
驗證表單輸入的文本長度是否大于某個最小值箭养,在輸入字段上使用AngularJS指令ng-minleng="{number}":
<input type="text" ng-minlength="5" />
3. 最大長度
驗證表單輸入的文本長度是否小于或等于某個最大值奥喻,在輸入字段上使用AngularJS指令ng-maxlength="{number}":
<input type="text" ng-maxlength="20" />
4. 模式匹配
使用ng-pattern="/PATTERN/"來確保輸入能夠匹配指定的正則表達式:
<input type="text" ng-pattern="[a-zA-Z]" />
5. 電子郵件
驗證輸入內(nèi)容是否是電子郵件偶宫,只要像下面這樣將input的類型設置為email即可:
<input type="email" name="email" ng-model="user.email" />
6. 數(shù)字
驗證輸入內(nèi)容是否是數(shù)字,將input的類型設置為number:
<input type="number" name="age" ng-model="user.age" />
7. URL
驗證輸入內(nèi)容是否是URL环鲤,將input的類型設置為 url:
<input type="url" name="homepage" ng-model="user.facebook_url" />
8.在表單中控制變量
表單的屬性可以在其所屬的$scope對象中訪問到纯趋,而我們又可以訪問$scope對象,因此JavaScript可以間接地訪問DOM中的表單屬性冷离。借助這些屬性吵冒,我們可以對表單做出實時(和AngularJS中其他東西一樣)響應。這些屬性包括下面這些西剥。
未修改的表單
這是一個布爾屬性痹栖,用來判斷用戶是否修改了表單。如果未修改瞭空,值為true揪阿,如果修改過值為false:
formName.inputFieldName.$pristine修改過的表單
只要用戶修改過表單疗我,無論輸入是否通過驗證,該值都返回true:
formName.inputFieldName.$dirty合法的表單
這個布爾型的屬性用來判斷表單的內(nèi)容是否合法南捂。如果當前表單內(nèi)容是合法的吴裤,下面屬性的值就是true:
formName.inputFieldName.$valid不合法的表單
這個布爾屬性用來判斷表單的內(nèi)容是否不合法。如果當前表單內(nèi)容是不合法的溺健,下面屬性的值為true:
formName.inputFieldName.$invalid錯誤
這是AngularJS提供的另外一個非常有用的屬性:$error對象麦牺。它包含當前表單的所有驗證內(nèi)容,以及它們是否合法的信息矿瘦。用下面的語法訪問這個屬性:
formName.inputfieldName.$error
AngularJS處理表單時枕面,會根據(jù)表單當前的狀態(tài)添加一些CSS類:
.ng-pristine {}
.ng-dirty {}
.ng-valid {}
.ng-invalid {}