Как вернуться к состоянию грязного состояния в AngularJS

Question

Я хотел бы узнать, есть ли способ в AngularJS, чтобы вернуть состояние объекта до того, как он был загрязнен.

У меня есть простой случай использования, в котором у меня есть edit, save a cancel кнопка. Если кто-то нажимает на кнопку редактирования, получает загрязненное состояние объекта, а затем нажмите кнопку «Отмена», я хотел бы вернуть состояние объекта в прежнее состояние (состояние до того, как оно стало грязным).

В тот момент, когда я нажимаю на кнопку cancel, состояние объектов выглядит измененным, даже если на самом деле его нет.

Могу ли я это достичь каким-то образом с помощью функции AngularJS?

кодекс, относящиеся к данному сообщению:

код в контроллере:

$scope.uneditedObject = null; 
$scope.handleEdit = function(state, index) { 
    $scope.uneditedObject = angular.copy($scope.objects[index]); 
    $scope.state = state; 
    $scope.index = index; 
    if(state == 'VIEW') { 
     $scope.objects[index] = $scope.uneditedObject 
     $scope.uneditedObject = null; 
    } 
} 

HTML код:

<tr ng-repeat="object in objects"> 
    <td ng-class="{'editing': $index == index}" > 
     {{object.name}} 
    </td> 
    <td > 
     <input type="text" numbers-only class="form-control" ng-model="object.discount" > 
    </td> 
    <td ng-class="{'editing': $index == index}" > 
     <a class="btn btn-sm red" ng-click="handleEdit('EDIT', $index)" ng-show="state != 'EDIT'"> 
      Edit 
     </a> 
     <a class="btn btn-sm blue" ng-show="state == 'EDIT'" ng-show="state != 'EDIT'" ng-click="update(...)"> 
      Save 
     </a> 
     <a class="btn btn-sm default" ng-show="state == 'EDIT'" ng-click="handleEdit('VIEW', $index)"> 
      Cancel 
     </a> 
    </td> 
</tr> 

Answer 1

Вы должны держать копию оригинальный объект лежащий около, использовать angular.copy():

$scope.originalItem=null; 
$scope.onEdit = function(item){ 
    $scope.originalItem = angular.copy(item); 
    $scope.item = item; 
} 

$scope.onEditCancel=function(){ 
    $scope.item = $scope.originalItem; 
    $scope.originalItem=null; 
}