AngularJS范围对象继承

时间:2013-08-13 10:04:28

标签: angularjs angularjs-scope angularjs-ng-repeat

嗨我需要一个AngularJS Wiz指出我正朝着正确的方向试图了解AngularJS Scope and Inheritance。 我有一个子Scope,我添加到Parent Scope然后我想通过array.push()添加一个新对象到Parent范围;但我不确定为什么Child范围会继承这个新值。请参阅此处的小提琴http://jsfiddle.net/sjmcpherso/EFxuZ/第一个使用ng-repeat和objects的示例会导致孩子更新:

$scope.childArr = [{'name':'peter'},{'name':'paul'},{'name':'perry'}];
$scope.parentArr = $scope.childArr;
$scope.parentArr.push({'name':'Why am I in now in the Child Array?'}) 

而仅使用变量的第二个示例不是:

$scope.childVar = "Confused Muchly";
$scope.test.parentVar = $scope.childVar;
$scope.test.parentVar = "This wont change the child variable";

理想情况下,我想对子作用域进行更改,这将更新父作用域,而不是相反。

我读过https://github.com/angular/angular.js/wiki/Understanding-Scopes而没有完全理解这个问题对我来说似乎是一个谜。

1 个答案:

答案 0 :(得分:2)

首先,您的模型$scope.childArr$scope.test.parentArr都位于控制器的$ scope范围内。它们都不在父范围内。

如果你想在父范​​围内拥有parentArr,那么你应该有一个父子控制器设计或在rootScope内移动你的模型:

$rootScope.test = {};
$rootScope.test.parentArr = [ /* some items here */ ];

其次,$scope.childArr$scope.test.parentArr都指向同一个数组。改变它们中的任何一个都意味着改变它们。

这几乎与:

相同
$scope.test = {};
$scope.childArr = $scope.test.parentArr = [
    {'name':'peter'},
    {'name':'paul'},
    {'name':'perry'}
];

如果您想创建单独的副本以便更改其中一个副本不会影响另一个副本,那么您可以使用 angular.copy()

$scope.test.parentArr = angular.copy($scope.childArr);