JavaScript 对象在不应该被 HTML 页面更改时

JavaScript object being changed by HTML Page when it shouldn't be

我正在使用 Angular 框架来创建 SPA。我想要做的是当用户点击表单的取消按钮时,显示的数据应该返回到其原始状态。为此,我使用了一个包含原始信息的 JavaScript 对象,然后使用 angular.copy() 将原始信息复制到 $scope 变量以供显示。

保存信息的代码。

getInfo.getMoreInformation("/views/people/" + $scope.vendorguid +"/payroll-details").success(function(data, status, headers, config){


            dataOracle = data.data['oracle-user'];

            $scope.oracle = {};

            $scope.oracle = data.data['oracle-user'];   


    })  

处理取消按钮点击的代码

$scope.orcancel = function(){

    $scope.oracle = {};

    angular.copy(dataOracle, $scope.oracle);

}

发生的事情是,当用户在 HTML 页面上对表单进行更改时,变量 dataOracle 也被更改。因此,当执行复制时,新输入的数据将传递给 $scope.oracle。我在其他页面上使用了相同的过程并且它按预期工作,但是在这个页面上它不能正常工作。

问题是我对显示字段和输入字段使用了相同的变量。更改变量后,问题消失了。