2012-11-18 11 views
14

Buduję przyciski radiowe dynamicznie. ng-change='newValue(value) przestaje być wywoływane po każdym naciśnięciu przycisku radiowego.Kątowe: radiobuttons przestają strzelać "ng-change" po każdym kliknięciu

to działa: Kliknięcie przycisku radio zmienia wartość na foo/bar/baz. http://jsfiddle.net/ZPcSe/19/

<div ng-controller="MyCtrl"> 
<input type="radio" ng-model="value" value="foo" ng-change='newValue(value)'> 
<input type="radio" ng-model="value" value="bar" ng-change='newValue(value)'> 
<input type="radio" ng-model="value" value="baz" ng-change='newValue(value)'>  
<hr> 
{{value}} 
</div> 

ten kod nie działa: Opcja {{value}} - „label” nie jest aktualizowany raz w przycisk radiowy został naciśnięty co najmniej raz. Aparently ng-change nie jest już zwalniany.

<div ng-controller="MyCtrl"> 
    <span ng-repeat="i in [0, 1, 2]"> 
    <input name="asdf" type="radio" ng-model="value" value={{i}} ng-change='newValue(value)'> 
    </span> 
    {{value}} 
</div> 

http://jsfiddle.net/ZPcSe/18/

Controlles to samo za każdym razem:

var myApp = angular.module('myApp', []); 

function MyCtrl($scope) { 
    $scope.value = '-'; 
    $scope.newValue = function(value) { 
    $scope.value = value; 
    } 
} 

Dzięki za pomoc.

Odpowiedz

21

ngRepeatcreates new scope, więc próbuje ustawić value ustawia go na nowy zakres. Rozwiązaniem jest odwoływać właściwość na obiekcie, który jest od zakresu dominującej - odnośnika obiekt dzieje zakresu nadrzędnego, a następnie zmieniając właściwość działa zgodnie z oczekiwaniami:

HTML:

<div ng-controller="MyCtrl"> 
<span ng-repeat="i in [0, 1, 2]"> 
    <input name="asdf" ng-model="options.value" value="{{i}}" type="radio"> 
</span> 
{{options.value}} 

JS :

var myApp = angular.module('myApp', []); 

function MyCtrl($scope) { 
    $scope.options = { 
     value: '-' 
    }; 
    $scope.newValue = function(value) { 
     // $scope.options.value = value; // not needed, unless you want to do more work on a change 
    } 
}​ 

Możesz sprawdzić a working fiddle tego obejścia. Aby uzyskać więcej informacji, patrz angular/angular.js#1100 on GitHub.

+1

To wygląda jak magia - jak i gdzie jest wywoływana nazwa '$ scope.newValue'? Nie ma zdarzenia 'ng-change' określonego w kodzie HTML, więc gdzie jest uruchamiane? – Richard

+0

@Richard Nie strzela; była to funkcja w pierwotnym pytaniu, więc skopiowałem ją; Myślę, że 'console.log' został pozostawiony z niektórych debugowania na JSFiddle. –

3

Wystarczy szybkie obejście, możemy osiągnąć o takim samym korzystając ng-model="$parent.value", ponieważ byłoby odwołać się do rodzica ng-repeat zakresu ie- w myCtrl zakresu

zmieniać tylko w ng-model -

<input name="asdf" type="radio" ng-model="$parent.value" value={{i}} ng-change='newValue(value)'> 

Here is the fiddle

0

Spróbuj ng-click instea d z ng-change.

Powiązane problemy