AngularJS: API: ng/directive/input[number]

input[number]

- input in module ng

数字格式的文本输入验证和转换。如果验证结果不是数字，则设置 number验证错误键。

指令信息

这个指令执行优先级为0.

用法

<input Type="number"
       ng-model=""
       [name=""]
       [min=""]
       [max=""]
       [required=""]
       [ng-required=""]
       [ng-minlength=""]
       [ng-maxlength=""]
       [ng-pattern=""]
       [ng-change=""]>

参数

参数	类型	详述
ngModel	string	声明用于数据绑定的Angular表达式。
name (可选)	string	发布到表单下的控件的属性名称。
min (可选)	string	当输入的值小于`min`时，设置`min` 验证错误键。
max (可选)	string	当输入的值大于`max`时，设置`max`验证错误键。
required (可选)	string	如果未输入值就设置 `required` 验证错误键。
ngRequired (可选)	string	当ngRequired表达式等于true时，添加`required`属性和`required`验证约束到元素上。使用`ngRequired`替换`required`，当你想数据绑定到`required`属性上时。
ngMinlength (可选)	number	如果值短于minlength则设置 `minlength` 验证错误键。
ngMaxlength (可选)	number	如果值长于maxlength则设置 `maxlength` 验证错误键。
ngPattern (可选)	string	如果值不匹配正则表达式则设置 `pattern` 验证错误键。值可以是 `/regexp/` 形式的内嵌正则表达式，或者是用 `regexp` 定义在scope中的表达式。
ngChange (可选)	string	Angular表达式，当输入元素通过用户交互方式发生输入变化时会执行这个表达式。

示例

index.html

<script>
  angular.module('numberExample', [])
    .controller('ExampleController', ['$scope', Function($scope) {
      $scope.value = 12;
    }]);
</script>
<form name="myForm" ng-controller="ExampleController">
  Number: <input Type="number" name="input" ng-model="value"
                 min="0" max="99" required>
  <span class="error" ng-show="myForm.input.$error.required">
    Required!</span>
  <span class="error" ng-show="myForm.input.$error.number">
    Not valid number!</span>
  <tt>value = {{value}}</tt><br/>
  <tt>myForm.input.$valid = {{myForm.input.$valid}}</tt><br/>
  <tt>myForm.input.$error = {{myForm.input.$error}}</tt><br/>
  <tt>myForm.$valid = {{myForm.$valid}}</tt><br/>
  <tt>myForm.$error.required = {{!!myForm.$error.required}}</tt><br/>
 </form>

protractor.js

var value = element(by.binding('value'));
var valid = element(by.binding('myForm.input.$valid'));
var input = element(by.model('value'));

it('should initialize to model', Function() {
  expect(value.getText()).toContain('12');
  expect(valid.getText()).toContain('true');});

it('should be invalid if empty', Function() {
  input.clear();
  input.sendKeys('');
  expect(value.getText()).toEqual('value =');
  expect(valid.getText()).toContain('false');});

it('should be invalid if over max', Function() {
  input.clear();
  input.sendKeys('123');
  expect(value.getText()).toEqual('value =');
  expect(valid.getText()).toContain('false');});