Warum wird meine Gültigkeitsbereichsbindung an ein Service-Array nicht aktualisiert, wenn das Array ersetzt wird

Question

Ich habe einen Gültigkeitsbereich, der an ein Array gebunden ist, das in einem Service gespeichert ist. Wenn sich das Array ändert, bemerkt der Bereich die Änderung und aktualisiert die Werte in meiner Vorlage.

Wenn das Array jedoch durch ein anderes Array ersetzt wird, scheint der Bereich keine Änderung zu erkennen und aktualisiert die Liste nicht.

Ich weiß, dass dies ein gemeinsames Verhalten von angularjs ist und dass es wahrscheinlich so sein soll, aber ich verstehe nicht warum. In meinem Verständnis sollte die Scope-Variable immer dann aktualisiert werden, wenn sich der gebundene Verweis ändert.

Ist $scope.myVar = anyOtherVar; nicht äquivalent zu $scope.$watch('anyOtherVar',function(..){//update myVar});?

Sehen Sie meine Geige, um das Problem zu demonstrieren. http://jsfiddle.net/sL9k7q9L/1/

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

//myApp.directive('myDirective', function() {}); 
myApp.factory('myService', function() { 
    var anyArray = [{"name":"peter"}]; 

    var anyOtherArray = [{"name":"laura"}]; 

    return { 
    anyArray: anyArray, 
    newElement: function(){ 
     anyArray.push({"name":"bob"}); 
    }, 
    replaceWholeArray: function(){ 
     anyArray = anyOtherArray; 
     console.log(anyArray); 
    } 
    } 
}); 

function MyCtrl($scope,myService) { 
    $scope.elements = myService.anyArray; 
    $scope.newElement = function(){ 
     myService.newElement(); 
    } 
    $scope.replaceWholeArray = function(){ 
     myService.replaceWholeArray(); 
    } 
} 

und die entsprechende Vorlage:

<div ng-controller="MyCtrl"> 
    <button ng-click="newElement()"> 
    newElement() 
    </button> 
    <button ng-click="replaceWholeArray()"> 
    replaceWholeArray() 
    </button> 
    <ul> 
    <li ng-repeat="el in elements">{{el.name}}</li> 
    </ul> 
</div> 

Answer 1

Sie Variablen aktualisieren, aber das Update keine anderen Variablenzuweisungen, die die ursprüngliche Variable hergestellt wurden unter Verwendung.

Referenz So zum Original-Array ist für myService.anyArray

Einfaches Beispiel gebrochen

var a = 1; 
var b = a; 
a = 2; 
alert(b);// is still 1 due to value of `a` when it was assigned 

Statt nur die Fabrik Objekt-Eigenschaft aktualisieren, aber zu tun, dass Sie einen Verweis auf das zurückgegebene Objekt zuerst

speichern müssen

myApp.factory('myService', function() { 
    var anyArray = [...]; 

    var anyOtherArray = [...]; 

    var factoryObject = { 
    anyArray: anyArray, 
    newElement: function() { 
     anyArray.push({"name": "bob"}); 
    }, 
    replaceWholeArray: function() { 
     // change this part 
     //anyArray = anyOtherArray; 
     // To: 
     factoryObject.anyArray = anyOtherArray; 
    } 
    } 

    return factoryObject 
});