8

我创建了一个简单的 jsfiddle 来说明我的问题:

小提琴

html:

<div ng-controller="MyCtrl">   
    <div ng-repeat="p in products">
        <span ng-click="overwrite(p)">{{ p.id }}: {{ p.name }}</span>
    </div>
</div>

Javascript:

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

function MyCtrl($scope) {

    var products = [{id:1, name:'first'}, {id:2, name:'second'}];
    $scope.products = products;

    var prod = {id: 3, name:'third'};

    $scope.overwrite = function(p){
        p.id = 4;
        p.name = 'forth';

        p = prod; // this doesn't work nor does angular.copy(prod)
    }
}

如您所见,当我手动设置属性时,值是绑定的。但是当我覆盖一个对象时,什么也没有发生。这怎么可能?当我想将对象恢复到原始状态时,我该怎么办?

想象一下,我使用var productBackup = angular.copy(product). 然后我对原始产品进行了更改,后来我决定取消我的更改。我想使用product = productBackup. 但这不起作用!在这种情况下,我是否需要像这样手动设置所有属性?

product.id = productBackup.id;
product.name = productBackup.name;
etc...
4

2 回答 2

23

如果你使用angular.copy(source, destination)你就能达到你想要的效果。

更新的小提琴

p发生的事情是,即使在您完成作业之后,angular 仍在观看原始参考。如果你使用angular.copy()你正在复制角度正确观看prod的值。p

我问了一个类似的问题,但它在共享服务中处理了这个问题。

于 2013-06-12T11:57:44.073 回答
3

我以前从未使用过 AngularJS,但我认为这里发生的情况是您的参数p不是简单的键/值对象,而是更复杂的 AngularJS 对象。通过将您分配prod给它,您将覆盖它而不是更改对象的特定部分。

也许下面的代码片段会帮助你:

for(var key in prod) {
    p[key] = prod[key];
}
于 2013-06-12T11:57:35.907 回答