2015-12-16 14 views
7

Napotkano to podczas migracji z wersji 1.2.14 do 1.4.8. Działa to dobrze w wersji 1.2.14, ale otrzymuję nieskończoną pętlę $ digest() w wersji 1.4.8. Oto Fiddle, demonstrujący problem. Skrzypcach jest dużo łatwiej patrzeć niż ten post, ale tak jest co mi zawierać kod

Mam select element, który wygląda tak:

<select ng-model="selectedId" ng-options="opt.id as opt.label for opt in getOptions()"> 

Moje opcje są obiektami, na przykład:

$scope.options = [ { id: 1, label: 'one' }, { id: 2, label: 'two' } ]; 

Szereg opcji, które chcę nadać dyrektywie ngOptions, zależy od warunków; czasami po prostu chcę dać to $scope.options, ale czasami chcę dołączyć inną opcję.

$scope.getOptions = function() { 
    if ($scope.showThirdOption) 
     return [{ id: 3, label: 'three' }].concat($scope.options); 
    else 
     return $scope.options; 
}; 

Teraz, jeśli programowo ustawić mój model do 3:

... 
$scope.selectedId = 3; 
... 

... kątowa nie będzie zdenerwowany, chociaż ta opcja nie istnieje. Dodaje on po prostu węzeł <option> do elementu <select>: <option value="?" selected="selected"></option>, a wybrana wartość z rozwijanego menu jest pusta.

Ale jeśli wtedy ustawię mój stan s.t. moi getOptions() Zwroty dodatkową opcję:

... 
$scope.selectedId = 3; 
$scope.showThirdOption = true; 
... 

... mam nieskończoną $ Digest() pętlę.

errors loop bad

Czy istnieje dobry sposób na uniknięcie problemu takiego? Czy myślisz, że to błąd w Angular (to technicznie regresja), czy jest to po prostu ... nie sposób, w jaki powinienem używać ngOptions?

~~~ Again, I have a nice Fiddle for you to play around with!! ~~~

+0

Oto przykład pokazujący, że ten problem nie występuje, jeśli opcje są wartościami zamiast obiektów: [** http: //jsfiddle.net/x15jccmj/3**] (http://jsfiddle.net/x15jccmj/3/). –

Odpowiedz

2

Błąd występuje, ponieważ zadzwonić getOptions function() w NG-opcji. Utwórz nową zmienną i przypisz wartość zwracana przez tę funkcję, a następnie używać go w NG-opcji:

$scope.newOptions = $scope.getOptions(); 

ng-options="opt.id as opt.label for opt in newOptions" 

Również nie zapomnij zaktualizować newOptions na kliknięcia przycisku.

Wtedy nie będziesz miał nieskończonego skrótu. Zobacz zaktualizowane skrzypce: http://jsfiddle.net/bbcjeuhb/

+0

Dzięki, działało świetnie !! :RE –

Powiązane problemy