使用 AngularJS “copy()"避免参考问题 [英] Using AngularJS "copy()" to avoid reference issues

问题描述

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

I'm displaying a list of items, each of which has an "edit"-button next to it. A click on that opens an angular ui modal window and the user can change some properties of the specific item.

现在，让我烦恼的是，在此编辑窗口中键入时，项目列表中的特定项目会立即反映更改.我只希望它在用户点击模态中的确定"时更新，如果用户选择取消"则根本不改变.

Now, what bugged me was that when typing in this edit-window, the specific item in the list of items reflected the changes immediatly. I only wanted it to update when the user clicked 'ok' in the modal, and to not change at all if the user chose 'cancel'.

我的解决方法是使用复制来制作所选项目的副本，然后作为视图的模型:

My workaround uses copy to make a, well, copy of the chosen item that then serves as model for the view:

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() 是否适合避免此类问题?这是一个范围问题吗?

推荐答案

是的，在这里使用 angular.copy() 绝对合适.如果您想要更高级的东西，您可能需要查看 angular-history

Yep, using angular.copy() is absolutely appropriate here. If you want something more advanced you might want to checkout angular-history

这篇关于使用 AngularJS “copy()"避免参考问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！