<div ng-app="">
<div ng-controller="MyCtrl">
<input required type="number" ng-model="teams.length" min="1" max="9">
<span>pressing backspace to remove the number causes an exception</span>
<div ng-repeat="team in teams track by $index">
team {{$index+1}}
</div>
</div>
function MyCtrl($scope) {
$scope.teams = [{}];
}
pressing backspace in the input causes the exception:
在输入中按退格键会导致异常：
RangeError: Invalid array length
at setter (http://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.1/angular.js:9982:12)
at token.fn.extend.assign (http://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.1/angular.js:9429:18)
at $setViewValue (http://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.1/angular.js:16390:7)
at http://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.1/angular.js:15654:14
at Scope.$eval (http://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.1/angular.js:11576:28)
at Scope.$apply (http://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.1/angular.js:11676:23)
at HTMLInputElement.listener (http://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.1/angular.js:15653:13)
at http://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.1/angular.js:2562:10
at Array.forEach (native)
at forEach (http://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.1/angular.js:300:11)
What I'd like to happen instead is for the input to fail authentication (ng-invalid). I'm running angular 1.2.16
我想要发生的是输入失败认证（ng-invalid）。我正在跑角1.2.16
的jsfiddle
1 个解决方案
#1
5
Do not bind directly on teams.length; rather create a new variable, say length, and bind to it. Then $watch it and apply the changes to teams.length, if appropriate. Make the input ng-required="true".:
不要直接绑定在teams.length上;而是创建一个新变量，比如说长度，并绑定到它。然后$ watch，并将更改应用于teams.length，如果合适的话。输入ng-required =“true”：
<input ng-required="true" type="number" ng-model="length" min="1" max="9" />
And:
和：
function MyCtrl($scope) {
$scope.teams = [{}];
$scope.length = $scope.teams.length;
$scope.$watch("length", function(newlength) {
if( newlength ) {
$scope.teams.length = newlength;
}
});
}
Fiddle: http://jsfiddle.net/6pcVN/
小提琴：http：//jsfiddle.net/6pcVN/
#1
5
Do not bind directly on teams.length; rather create a new variable, say length, and bind to it. Then $watch it and apply the changes to teams.length, if appropriate. Make the input ng-required="true".:
不要直接绑定在teams.length上;而是创建一个新变量，比如说长度，并绑定到它。然后$ watch，并将更改应用于teams.length，如果合适的话。输入ng-required =“true”：
<input ng-required="true" type="number" ng-model="length" min="1" max="9" />
And:
和：
function MyCtrl($scope) {
$scope.teams = [{}];
$scope.length = $scope.teams.length;
$scope.$watch("length", function(newlength) {
if( newlength ) {
$scope.teams.length = newlength;
}
});
}
Fiddle: http://jsfiddle.net/6pcVN/
小提琴：http：//jsfiddle.net/6pcVN/