获取sessionStorage并恢复价值

Question

我有一个角度不同的应用程序。 在第一个视图上，我创建一个变量，在第二个视图上，我必须对其进行编辑。 我用这个“ sessionStorage”。 在第一个视图上，当我转到另一页时，我在$ sessionStorage上记录了变量列表。

当我开始第二个视图时，我得到了这些数据。 在此视图上，我希望能够编辑或不编辑值。 当我点击有效按钮时，我记录了新值，当我按下取消按钮时，我得到了初始值。

这是第二个视图的js文件。

angular.module('testNgStorageApp')
  .controller('MainCtrl', function ($scope, $sessionStorage) {
    var listNameRecorded = $sessionStorage.namesRecord;
    $scope.listNameTemp = listNameRecorded || [];

    $scope.edit = function(index){
        console.log("before", $scope.listNameTemp, listNameRecorded, $sessionStorage.namesRecord)
        $scope.listNameTemp[index] = $scope.newText;
        console.log("after", $scope.listNameTemp, listNameRecorded, $sessionStorage.namesRecord)
    }
...
});

html

<div ng-repeat="name in listNameTemp">
    <span>{{name}}</span>
    <input ng-model="newText"/>
    <button ng-click="edit($index)">Edit</button>
  </div>

我的问题是当我编辑值（$ scope.listNameTemp）时，$ sessionStorage.namesRecords是自动修改的。

Answer 1

为什么原因$sessionStorage.namesRecords越来越修改是，基准$sessionStorage.namesRecords被分配到$scope.listNameTemp 。

您可以使用angular.copy()来解决此问题。 angular.copy()创建并返回传递给它的对象的全新副本。

更新的代码：

angular.module('testNgStorageApp')
  .controller('MainCtrl', function ($scope, $sessionStorage) {
    var listNameRecorded = angular.copy($sessionStorage.namesRecord);
    $scope.listNameTemp = listNameRecorded || [];

    $scope.edit = function(index){
        console.log("before", $scope.listNameTemp, listNameRecorded, $sessionStorage.namesRecord)
        $scope.listNameTemp[index] = $scope.newText;
        console.log("after", $scope.listNameTemp, listNameRecorded, $sessionStorage.namesRecord)
    }
...
});