摘要：新增的日期選擇器。類型必填必填最小長(zhǎng)度最大長(zhǎng)度正則匹配正則匹配更新觸發(fā)即使沒有使用校驗(yàn)屬性，只要數(shù)據(jù)不符合格式，就會(huì)被更新成。

input一般和ngModel結(jié)合使用來實(shí)現(xiàn)雙向綁定，同時(shí)angular提供了很多表單校驗(yàn)的指令

required 必填

ngRequired 必填（ngRequired可以控制是否是必填校驗(yàn)）

ngMinlength 最小長(zhǎng)度

ngMaxlength 最大長(zhǎng)度

pattern 正則匹配

ngPattern 正則匹配

ngChange 內(nèi)容改變時(shí)觸發(fā)

ngTrim 是否trim數(shù)據(jù)，默認(rèn)true

#html

    


#script
angular.module("learnModule", [])

.controller("LearnCtrl", function ($scope) {
    $scope.change = function () {
        alert("change");
    }

});

當(dāng)input有校驗(yàn)屬性時(shí)，如果輸入的值不符合校驗(yàn)條件，model會(huì)被更新成undefined。如果想正常更新model可以通過ngModelOptions設(shè)置。

版本：v1.3.9-local

當(dāng)未設(shè)置ngTrueValue和ngFalseValue時(shí)，默認(rèn)值是true和false。

#html

{{check}}

設(shè)置了這兩個(gè)值了，就可以指定選中和未選中的model值。checkbox同樣也有ng-chage指令。

  
ngTrueValue和ngFalseValue的參數(shù)是表達(dá)式哦。

#html

    

    
{{check}}
        


#script
angular.module("learnModule", [])

        .controller("LearnCtrl", function ($scope) {
            $scope.check = "YES";
            $scope.change = function () {
                alert("change");
            }
        });

單選按鈕

value 選擇中時(shí)的值

ngValue 選擇中時(shí)的值（表達(dá)式）

ngchange model更新觸發(fā)

  
沒有required屬性，沒辦法做必填校驗(yàn)，所以最好初始化的時(shí)候默認(rèn)選中一個(gè)。

#html

    
    

    
{{radio}}


#script
angular.module("learnModule", [])

        .controller("LearnCtrl", function ($scope) {
            $scope.radio = "value2";
            $scope.change = function () {
                alert("change");
            }
        });

H5新增的日期選擇器。

required 必填

ngRequired 必填

min 最小日期

max 最大日期

ngChange model更新觸發(fā)

  
如果給date初始化值，model一定得是Date類型，否則會(huì)報(bào)錯(cuò)。

#html

    

    
{{date}}


#script
angular.module("learnModule", [])

        .controller("LearnCtrl", function ($scope) {
            $scope.date = new Date("2015-12-12");
            $scope.change = function () {
                alert("change");
            }
        });

日期時(shí)間選擇器
用法基本同input[date]，就是比date多了個(gè)時(shí)間選擇。

月份選擇器，只能選擇年和月。

required 必填

ngRequired 必填

min 最小月份

max 最大月份

ngChange model更新觸發(fā)

  
如果給month初始化值，model一定得是Date類型，否則會(huì)報(bào)錯(cuò)。

#html

    

    
{{month}}


#script
angular.module("learnModule", [])

        .controller("LearnCtrl", function ($scope) {
            $scope.month = new Date("2015-05");
            $scope.change = function () {
                alert("change");
            }
        });

時(shí)間選擇

required 必填

ngRequired 必填

min 最小時(shí)間

max 最大時(shí)間

ngChange model更新時(shí)觸發(fā)

  
如果給time初始化值，model一定得是Date類型，否則會(huì)報(bào)錯(cuò)。

#html

    

    
{{time}}


#script
angular.module("learnModule", [])

        .controller("LearnCtrl", function ($scope) {
            $scope.time = new Date("2015-12-12 20:00:00");
            $scope.change = function () {
                alert("change");
            }
        });

周選擇

required 必填

ngRequired 必填

min 最小周數(shù)

max 最大周數(shù)

ngChange model更新觸發(fā)

  
如果給week初始化值，model一定得是Date類型，否則會(huì)報(bào)錯(cuò)。

#html

    

    
{{week}}


#script
angular.module("learnModule", [])

        .controller("LearnCtrl", function ($scope) {
            $scope.week = new Date("2015-01-12");
            $scope.change = function () {
                alert("change");
            }
        });

數(shù)字類型

required 必填

ngRequired 必填

min 最小值

max 最大值

ngMinlength 最小長(zhǎng)度

ngMaxlength 最大長(zhǎng)度

pattern 正則匹配

ngPattern 正則匹配

ngChange model更新觸發(fā)

  
即使沒有使用校驗(yàn)屬性，只要數(shù)據(jù)不是Number類型，model就會(huì)被更新成undefined。

#html

    

    
{{number}}


#script
angular.module("learnModule", [])

        .controller("LearnCtrl", function ($scope) {
            $scope.number = 35;
            $scope.change = function () {
                alert("change");
            }
        });

郵箱類型

required 必填

ngRequired 必填

ngMinlength 最小長(zhǎng)度

ngMaxlength 最大長(zhǎng)度

pattern 正則匹配

ngPattern 正則匹配

ngChange model更新觸發(fā)

  
即使沒有使用校驗(yàn)屬性，只要數(shù)據(jù)不符合郵箱格式，model就會(huì)被更新成undefined。

#html

    

    
{{email}}


#script
angular.module("learnModule", [])

        .controller("LearnCtrl", function ($scope) {
            $scope.email = "";
            $scope.change = function () {
                alert("change");
            }
        });

url類型

required 必填

ngRequired 必填

ngMinlength 最小長(zhǎng)度

ngMaxlength 最大長(zhǎng)度

pattern 正則匹配

ngPattern 正則匹配

ngChange model更新觸發(fā)

  
即使沒有使用校驗(yàn)屬性，只要數(shù)據(jù)不符合url格式，model就會(huì)被更新成undefined。

#html

    

    
{{url}}


#script
angular.module("learnModule", [])

        .controller("LearnCtrl", function ($scope) {
            $scope.url = "";
            $scope.change = function () {
                //alert("change");
            }
        });