0

通过这段代码，我试图在编辑之前或在事件视图中进行任何更改以实现取消按钮之前获取事件的副本，因此我将其复制到 oldValue 变量，但事件和 oldValue 始终为空，因为（我认为）它们在填充事件变量的事件工厂返回之前执行

我能做些什么来解决这个问题？

事件 html

<sw-event-view event="ev.event" ng-hide="ev.loading" ng-if="ev.view_type == 'event'" ></sw-event-view>

事件控制器

angular.module('App')
       .controller('EventCtrl', function ($scope, $state, $http, EventFactory) {
            ev.event = {};

            console.log('controller start');
            ev.view_type = 'event';
            EventFactory.getEvent(1)
                       .then( function(r) { 
                                    ev.event = r.data.data.event;
                                    console.log('event controller',ev.event);
                                    ev.loading = false; 
                         } ,handleHttpError);
             console.log('end of controller');

}

事件视图html

<div>Something</div
<sw-basic-info ng-show="!edit_mode && selected_tab == 'basic info'" event="event"></sw-basic-info> 

<sw-locations-list ng-show="(selected_tab == 'locations') && !edit_mode" locations="event.locations"></sw-locations-list>

事件视图指令

angular.module('App')
       .directive('swEventView', function (EventFactory) {
         return {
            scope: {
               event: "=", 
           },
         templateUrl: 'template url',
         restrict: 'E',
         link: function (scope, element, attrs) {
             console.log('event view scope.event', scope.event);
             scope.oldValue = angular.copy(scope.event);
             console.log('event view scope.oldValue', scope.oldValue);
         }
   }

事件工厂

angular.module('App')
       .factory('EventFactory', function ($http, $q) {

            var getEvent = function (id) {
                              console.log('event factory', id);
                              return $http.get(server + "event/"+id);
              }

}

这就是我在日志中看到的

controller start
event factory 1
end of controller
event view scope.event Object {}
event view scope.oldValue Object {}

event controller
Object {id: 1, event_code: "5020048072", name: "Heathcote", short_name: "Hea", description: "Dolor unde molestiae fuga culpa aut excepturi iste et esse tempore illo quia quod aut."…}
4

1 回答 1

1

您可能希望通过多种方式以角度恢复旧数据，以下所有内容仅涉及控制器而不是指令。

在任何更改之前恢复到原始数据的情况下，您只需在加载时将数据复制到另一个变量，并在需要时替换更改的数据。

var originalData = angular.copy($scope.data);

$scope.reset = function() {
  $scope.data = originalData;
};

如果您想恢复到事件之前的数据（即最后一次 ngModel 更新之前），一个选项是使用 $scope.$watch 不断覆盖存储在变量中的先前值。

var prevData;

$scope.$watch('data', function (nv, ov) {
    // Add to history (create a copy)
    prevData = angular.copy(ov);
}, true);

$scope.reset = function() {
   $scope.data = prevData;
};

或者对于您可以使用的输入$rollbackViewValue()

$scope.cancel = function(e) {
    // if the escape key pressed
    if (e.keyCode == 27) {
       $scope.formName.fieldName.$rollbackViewValue();
    }
};

html将是

<form name="formName" role="form">
    <input type="number" class="form-control" name="fieldName" ng-model="data" ng-model-options="{updateOn: 'blur'}" ng-keyup="cancel($event)">
</form>
于 2015-11-06T07:11:01.627 回答