2014-04-23 10 views
7
<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> 

RangeError quando l'ingresso legame Array.length

function MyCtrl($scope) { 
    $scope.teams = [{}]; 
} 

premendo backspace nell'input causa l'eccezione:

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) 

Quello che mi piacerebbe che accada invece è per l'ingresso autenticazione fallita (ng-invalid). Io corro angolare 1.2.16

JSFiddle

risposta

5

Non legarsi direttamente sulla teams.length; crea piuttosto una nuova variabile, ad esempio length e esegui il binding. Quindi $watch e applicare le modifiche a teams.length, se appropriato. Rendere l'ingresso ng-required="true":.

<input ng-required="true" type="number" ng-model="length" min="1" max="9" /> 

E:

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/

+0

Grazie. A proposito, c'è una ragione specifica per cui stai scegliendo ng-required = "true" semplicemente "richiesto" in questo caso? –

+0

Hai ragione, 'required' ha lo stesso effetto; Preferisco 'ng-required' per essere sicuro, ma in questo caso è ridondante. –

Problemi correlati