修改

Question

我在编辑副本时遇到一些问题。

当您第一次编辑记录时，它会被分配到$scope.original，并且会复制一份副本进行编辑并存储在$scope.copy中，可以将其更改并保存回$scope.original，其中 - 正确更新$scope.something。

问题是在编辑第一条记录时，如果您随后获取其中一个值的副本以进行进一步编辑，则在调用$scope.saveSomething()函数时它不会更新。

＆＃13;

var myApp = angular.module('myApp', []);

function MyCtrl($scope) {

  $scope.Something = [{
    name: "Aye",
    desc: new Date()
  }, {
    name: "Bee",
    desc: new Date()
  }, {
    name: "See",
    desc: new Date()
  }];

  //=================== First copy

  $scope.edit = function(what) {
    $scope.original = what;
    $scope.copy = angular.copy(what);
  }

  $scope.save = function(copy) {
    angular.copy($scope.copy, $scope.original);
    $scope.cancel();
  }

  $scope.cancel = function() {
    $scope.copy = null;
  }

  //=================== Second copy

  $scope.editName = function(what) {
    $scope.originalName = what;
    $scope.copyName = angular.copy(what);
  }

  $scope.saveName = function() {
    angular.copy($scope.copyName, $scope.originalName);
    $scope.cancelName();
  }

  $scope.cancelName = function() {
    $scope.copyName = null;
  }
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="myApp">
  <div ng-controller="MyCtrl">
    <div ng-repeat="s in Something">
      <pre>{{s | json}}</pre>
      <a ng-click='edit(s)'>edit</a>
      <br/>
      <br/>
    </div>

    <input type='text' ng-model='copy.name' />
    <input type='text' ng-model='copy.desc' />
    <br/>
    <button ng-click='save(copy)' ng-disabled="!copy">save</button>
    <button ng-click='cancel()' ng-disabled="!copy">cancel</button>
    <a ng-click='editName(copy.name)'>edit name</a>
    <br>
    <br>
    <input type='text' ng-model='copyName' />
    <br>
    <button ng-click='saveName()' ng-disabled="!originalName">saveName</button>
    <button ng-click='cancelName()' ng-disabled="!originalName">cancelName</button>
  </div>
</div>

＆＃13;

我是Angular的新手，现在已经在这个问题上摸不着头脑了，有什么想法吗？

修改

更新了代码以提供更好的示例，第一个版本建议您可能知道您正在编辑的第一个编辑值的值，并且解决了scarlz发布的解决方案（http://jsfiddle.net/Karl33to/w23ppp9r/）只是设置了值直接在第二个保存函数中，但我需要能够对第一个编辑加载的任何值进行第二次编辑。

如果您更容易运行/分叉http://jsfiddle.net/w23ppp9r/2/

，也创造了一个小提琴

Answer 1

您的问题源于您使用angular.copy。在$scope.saveName中，您的目标$scope.originalName是一个字符串，这将导致角度抛出错误。

如果您正在使用基元，实际上没有理由使用angular.copy。相反，您可以在此处使用以下内容：

$scope.editName = function(what) {
  $scope.originalName = what;
  $scope.copyName = what;
};

$scope.saveName = function() {
  $scope.copy.name = $scope.copyName;
  $scope.cancelName();
}

Answer 2

我设法提出了一个简单的解决方案，似乎有效。

如果我传入密钥和对象的副本，而不是将原语传递给第二个编辑函数，我可以正确地更新第一个副本。

这是一个工作小提琴http://jsfiddle.net/w23ppp9r/3/ ......以及相关的代码：

//=================== Second copy

$scope.editSomething = function(key, obj) {
    $scope.originalKey = key;
    $scope.originalObj = obj;
    $scope.copyVal = obj[key];
};

$scope.saveSomething = function(newVal) {
    $scope.originalObj[$scope.originalKey] = newVal;
    $scope.cancelEdit();
}

$scope.cancelEdit = function() {
    $scope.originalKey = null;
    $scope.originalObj = null;
    $scope.copyVal = null;
}

有更好的答案吗？

Angular编辑副本的副本

修改

2 个答案: