使用AngularJS“copy()”来避免引用问题

时间:2014-03-24 23:08:56

标签: javascript angularjs angularjs-scope

我正在显示一个项目列表,每个项目旁边都有一个“编辑”按钮。单击它可打开角度ui模态窗口,用户可以更改特定项目的某些属性。

现在,让我感到困惑的是,在输入此编辑窗口时,项目列表中的特定项目立即反映了这些更改。当用户在模态中单击“确定”时,我只希望它更新,如果用户选择“取消”,则根本不需要更改。

我的解决方法使用copy制作所选项目的副本,然后将其作为视图的模型:

var modalInstance = $modal.open({
    templateUrl: 'scripts/app/views/editBond.html',
    controller: function ($scope, $modalInstance, bond) {
        $scope.bond = angular.copy(bond);
        $scope.ok = function () {
            $modalInstance.close($scope.bond);
        };
        $scope.cancel = function () {
            $modalInstance.dismiss('cancel');
        };
    },
    resolve: {
        bond: function () {
            return bond;
        }
    }
});

使用angular.copy()是否适合避免此类问题?这是一个范围问题吗?

1 个答案:

答案 0 :(得分:13)

是的,使用angular.copy()绝对合适。如果您想要更高级的内容,可以查看angular-history