2016-08-03 9 views
1

Ich habe einen einfachen Beispielcode, besteht aus 3 Variablen ab und testvar, testvar ist Summe von a und b, ich versuche zu verstehen, warum die Bindung nicht für Variable testvar funktioniert, wenn Wert von a ändert, ich habe mit seinem Modell eine Eingabe als erstellt.Angularjs Bind Problem

$scope.mymodel.testvar =$scope.mymodel.a+$scope.mymodel.b; 

Wird a + b zu testvar nur einmal unter Verwendung der Anfangswerte von a und b: Wie dies erreicht werden kann, ist jede Hilfe stark

<!DOCTYPE html> 
<html> 
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script> 
<body> 

<div ng-app="myApp" ng-controller="myCtrl"> 

<input ng-model="mymodel.a"><br> 
Why this value does ot change on changing input:{{ mymodel.testvar}} 
<br> 
mymodel.a changes on input change: {{mymodel.a}} 
</div> 

<script> 
var app = angular.module('myApp', []); 
app.controller('myCtrl', function($scope) { 
$scope.mymodel={}; 

$scope.mymodel.a=1; 
$scope.mymodel.b=2 
$scope.mymodel.testvar =$scope.mymodel.a+$scope.mymodel.b; 
}); 
</script> 

<p>Test Binding.</p> 

</body> 
</html> 

Antwort

1

Diese Zeile geschätzt.

Eine Lösung ist testvar in eine Funktion zu aktivieren, wie folgt aus:

// Javascript 
$scope.getTestVar = function() { 
    return $scope.mymodel.a+$scope.mymodel.b; 
}; 

<!-- HTML --> 
TestVar: {{getTestVar()}} 
1

Der Grund Ihrer mymodel.testvar Updates nicht erhalten, wenn Sie mymodel.a oder mymodel.b ändern ist, weil, wenn der Controller zum ersten Mal ausgeführt wird testvar wird auf die Summe von a und b 's Anfangswerte daher testvar ist gleich 3. Also die Variable testvar speichert den Literalwert 3. Jetzt, wenn Sie a oder b ändern, sagen wir 4 Sie sind nicht re -evaluierend testvar. testvar ist immer noch 3. In Szenarien wie diesem, wenn Sie testvar neu berechnen müssen, um es in eine Funktion wie mymodel.testvar = function(){ return mymodel.a + mymodel.b}; setzen Sie binden dann an den Funktionsaufruf. Oder in eckigen können Sie direkt an den Zusatzausdruck binden wie {{mymodel.a + mymodel.b}}

+0

Vielen Dank! Ordentliche Erklärung – PortalGuy

Verwandte Themen