a easy AngularJS Form Validation plugin.
簡潔高效的__表單驗證插件__

See how powerful it.
看看它有多強大

動態(tài)校驗

自動關聯(lián)提交按鈕

多種 tip 校驗消息提示

不只校驗 dom 元素值，還可以校驗 ngModel 數(shù)據(jù)模型

支持任意類型表單元素，甚至可以校驗非表單元素

提供 type 類型校驗模板，你幾乎不需要定校驗規(guī)則

提供自定義規(guī)則

支持第三方組件校驗

IE 9+

angularjs 1.5+

HOME - 首頁
DEMO - 示例

npm install ng-verify

require("angular");//在使用前，你需要引入angular

require("ngVerify");//引入verify組件

var app = angular.module("APP",["ngVerify"]);//注冊組件

標記一個表單范圍 verify-scope

標記需要驗證的元素 ng-verify

綁定提交按鈕 control

入口指令，規(guī)定組件所控制的表單范圍

    ...

defualt: 1
設置整個表單的錯誤消息樣式

0 禁用tip提示

1 氣泡浮動提示，在元素右上角浮出

2 氣泡固定高度，緊接著元素另起一行

...

元素指令，定義驗證規(guī)則

只需要使用ng-verify，會根據(jù)type類型校驗非空驗證和類型的格式

defualt: true
false允許空值通過校驗

min,max
定制校驗字符長度

自定義正則，這樣會優(yōu)先以你的正則進行校驗

自定義錯誤消息，會覆蓋掉默認的提示。

defualt: 0
select下拉菜單屬性，指定的option表示選中會校驗不通過

    請選擇
        1
        2
        3

defualt: 1
checkbox最少勾選數(shù)，指定至少勾選幾項才會通過驗證

    checkbox
    
    
    
     Captain America
     Iron Man
     Hulk

指定一個元素進行2次校驗，接收參數(shù)為 #id 或 name

綁定一個表單提交按鈕, control:"formName"

    ...

     

     


提交 

defualt: true
設置 disabled:false 提交按鈕在表單未校驗通過時不會禁用，并且會自動綁定一個click事件，點擊時標記所有錯誤表單。
注意：a 標簽是沒有 disabled 屬性的，所以請使用 button 或者 input 來做按鈕。

    按鈕

defualt: form verify-scope
同上，設置單個元素提示樣式

依賴注入

//依賴注入ngVerify后，可以調(diào)用一些公共方法
app.controller("yourCtrl",function(ngVerify){
    ...
})

ngVerify.check("formName", call_back, draw)
檢測一個verify表單是否驗證通過，并刷新一次提交按鈕的狀態(tài)

"formName"             String      //指定檢測form的name值 (必須)
call_back              Function    //檢測完成后的回調(diào) (可選)
draw (default:true)    Boolean     //是否標記出未驗證通過的元素 (可選)

//返回所有未驗證通過的表單元素，并標記
ngVerify.check("formName",function (errEls) {
    console.log(errEls);
});

//標記出未驗證通過元素
ngVerify.check("formName");

//返回所有未驗證通過的表單元素，不標記
ngVerify.check("formName",function (errEls) {
    console.log(errEls);
},false);

ngVerify.checkElement(elemet, draw)
檢測一個元素是否驗證通過

element                id/name/DomObj  //參數(shù) id 或 name 或一個原生 dom 對象
draw (default:true)    Boolean     //是否標記出未驗證通過的元素 (可選)

ngVerify.setError(element, errmsg)
將一個表單元素強制標記為未驗證通過，第二參數(shù)不傳時取消標記。

element 需要標記的元素，可傳入dom、id或者name,id需要帶#

errmsg tip提示錯誤時顯示的消息，其優(yōu)先級高于其他錯誤消息

ngVerify.setError("#id","這里有錯") //以id標記錯誤
ngVerify.setError("name") //以name取消標記錯誤

ngVerify.scope()
獲取一個verify表單的$scope作用域

ngVerify.scope("formName")

設置表單元素type類型，目前支持的type類型：

email

number

phone

url

radio

checkbox

select

char (字母加下劃線)

date/dates (yyyy-mm-dd || yyyy-mm ) (hh:mm || hh:mm:ss) 時間部分非必須

file

傳入的參數(shù)字符串都必須是對象參數(shù)"{key1: value1, key2: value2}"，可以不寫大括號 { }

checkbox、radio組綁定驗證最好綁在最后一個

errmsg參數(shù)通常不需要你設置

表單范圍內(nèi)的按鈕，只要type="submit"則不需要設置control參數(shù)

帶有 ngModel 的元素，其數(shù)據(jù)模型具有較高的校驗優(yōu)先級

不支持form嵌套

不再限制長度輸入，只觸發(fā)校驗