input[text]

input一般和ngModel结合使用来实现双向绑定，同时angular提供了很多表单校验的指令

• required 必填
• ngRequired 必填（ngRequired可以控制是否是必填校验）
• ngMinlength 最小长度
• ngMaxlength 最大长度
• pattern 正则匹配
• ngPattern 正则匹配
• ngChange 内容改变时触发

• ngTrim 是否trim数据，默认true

  #html
        
      
         
        
  #scriptangular.module('learnModule', []).controller('LearnCtrl', function ($scope) {    $scope.change = function () {        alert('change');    }});

当input有校验属性时，如果输入的值不符合校验条件，model会被更新成undefined。如果想正常更新model可以通过ngModelOptions设置。

版本：v1.3.9-local

input[checkbox]

当未设置ngTrueValue和ngFalseValue时，默认值是true和false。

#html
{
   {check}}

设置了这两个值了，就可以指定选中和未选中的model值。checkbox同样也有ng-chage指令。

ngTrueValue和ngFalseValue的参数是表达式哦。

#html
    
    
         
     
{
   {check}}
        
    
#scriptangular.module('learnModule', [])        .controller('LearnCtrl', function ($scope) {            $scope.check = 'YES';            $scope.change = function () {                alert('change');            }        });

input[radio]

单选按钮

• value 选择中时的值
• ngValue 选择中时的值（表达式）
• ngchange model更新触发

没有required属性，没办法做必填校验，所以最好初始化的时候默认选中一个。

#html
    
    
         
         
     
{
   {radio}}
    
#scriptangular.module('learnModule', [])        .controller('LearnCtrl', function ($scope) {            $scope.radio = 'value2';            $scope.change = function () {                alert('change');            }        });

input[date]

H5新增的日期选择器。

• required 必填
• ngRequired 必填
• min 最小日期
• max 最大日期
• ngChange model更新触发

如果给date初始化值，model一定得是Date类型，否则会报错。

#html
    
    
         
     
{
   {date}}
    
#scriptangular.module('learnModule', [])        .controller('LearnCtrl', function ($scope) {            $scope.date = new Date('2015-12-12');            $scope.change = function () {                alert('change');            }        });

input[datetime-local]

日期时间选择器

用法基本同input[date]，就是比date多了个时间选择。

input[month]

月份选择器，只能选择年和月。

• required 必填
• ngRequired 必填
• min 最小月份
• max 最大月份
• ngChange model更新触发

如果给month初始化值，model一定得是Date类型，否则会报错。

#html
    
    
         
     
{
   {month}}
    
#scriptangular.module('learnModule', [])        .controller('LearnCtrl', function ($scope) {            $scope.month = new Date('2015-05');            $scope.change = function () {                alert('change');            }        });

input[time]

时间选择

• required 必填
• ngRequired 必填
• min 最小时间
• max 最大时间
• ngChange model更新时触发

如果给time初始化值，model一定得是Date类型，否则会报错。

#html
    
    
         
     
{
   {time}}
    
#scriptangular.module('learnModule', [])        .controller('LearnCtrl', function ($scope) {            $scope.time = new Date('2015-12-12 20:00:00');            $scope.change = function () {                alert('change');            }        });

input[week]

周选择

• required 必填
• ngRequired 必填
• min 最小周数
• max 最大周数
• ngChange model更新触发

如果给week初始化值，model一定得是Date类型，否则会报错。

#html
    
    
         
     
{
   {week}}
    
#scriptangular.module('learnModule', [])        .controller('LearnCtrl', function ($scope) {            $scope.week = new Date('2015-01-12');            $scope.change = function () {                alert('change');            }        });

input[number]

数字类型

• required 必填
• ngRequired 必填
• min 最小值
• max 最大值
• ngMinlength 最小长度
• ngMaxlength 最大长度
• pattern 正则匹配
• ngPattern 正则匹配
• ngChange model更新触发

即使没有使用校验属性，只要数据不是Number类型，model就会被更新成undefined。

#html
    
    
         
     
{
   {number}}
    
#scriptangular.module('learnModule', [])        .controller('LearnCtrl', function ($scope) {            $scope.number = 35;            $scope.change = function () {                alert('change');            }        });

input[email]

邮箱类型

• required 必填
• ngRequired 必填
• ngMinlength 最小长度
• ngMaxlength 最大长度
• pattern 正则匹配
• ngPattern 正则匹配
• ngChange model更新触发

即使没有使用校验属性，只要数据不符合邮箱格式，model就会被更新成undefined。

#html
    
    
         
     
{
   {email}}
    
#scriptangular.module('learnModule', [])        .controller('LearnCtrl', function ($scope) {            $scope.email = '';            $scope.change = function () {                alert('change');            }        });

input[url]

url类型

• required 必填
• ngRequired 必填
• ngMinlength 最小长度
• ngMaxlength 最大长度
• pattern 正则匹配
• ngPattern 正则匹配
• ngChange model更新触发

即使没有使用校验属性，只要数据不符合url格式，model就会被更新成undefined。

#html
    
    
         
     
{
   {url}}
    
#scriptangular.module('learnModule', [])        .controller('LearnCtrl', function ($scope) {            $scope.url = '';            $scope.change = function () {                //alert('change');            }        });