javascript - 无法使用 angularjs 重置 $scope 变量

Question

我有一个工厂，它被注入(inject)到我的所有 Controller 中以初始化和存储状态。

state.js

angular.module('c2gyoApp')
  .factory('state', function() {

    var now = new moment().startOf('hour');

    return {
      rental: {
        tab: 'simple',
        startDate: now.clone().add(1, 'h'),
        endDate: now.clone().add(10, 'h'),
        distance: 10,
        timeMinutes: 0,
        timeHours: 10,
        timeDays: 0,
        timeWeeks: 0,
        timeStanding: 0,
        airport: false
      }
    };
  });

每个 Controller 的开始看起来像这样

c2gdtp.js

angular.module('c2gyoApp')
  .controller('C2gdtpCtrl', [
    '$scope',
    'c2gConfig',
    'duration',
    'state',
    function($scope, config, duration, state) {
      $scope.rental = state.rental;
      ...
    }
  ]);

这与不同 Controller 的预期目的一样。对 $state.rental 对象所做的每个更改都通过不同的 View / Controller 保存。

我在每个 Controller 都使用的指令中实现了一个 clear() 函数:

timeinputform.js

angular.module('c2gyoApp')
  .directive('timeInputForm', function() {
    return {
      restrict: 'E',
      templateUrl: 'scripts/directives/timeInputForm.html',
      controller: function($scope) {
        ...
        $scope.clear = function() {
          var now = new moment().startOf('hour').add(1, 'h');

          $scope.rental = {
            startDate: now.clone(),
            endDate: now.clone(),
            distance: 0,
            timeMinutes: 0,
            timeHours: 0,
            timeDays: 0,
            timeWeeks: 0,
            timeStanding: 0,
            airport: false
          };

          angular.copy($scope.rental);
        };

      }
    };
  });

问题是它不保存 $state.rental 对象的重置。例如，如果我在 view1/controller1 中并单击清除按钮，则 $state.rental 对象将被重置。如果我更改为 view2/controller2，我将获得与单击清除按钮之前相同的旧值。如果我再次转到 view1/controller1，尽管我单击了清除按钮，但我仍然拥有之前相同的旧值。

clear() 函数位于指令中，因为这是清除按钮所在的位置。我尝试将 clear 函数复制到 Controller 中，得到相同的结果。

我只想清除所有 Controller 的状态。这有什么技巧吗？

编辑 @zeroflagL 干净的解决方案是什么样的？我尝试在工厂中设置clearRental功能:

edit#2我的最终解决方案。选项卡值必须保持不变，并且我无法再在工厂中将其从 $scope 中取出。现在正在传承。

state.js

angular.module('c2gyoApp')
  .factory('state', function() {

    var now = new moment().startOf('hour');

    var rental = {
      tab: 'simple',
      startDate: now.clone().add(1, 'h'),
      endDate: now.clone().add(10, 'h'),
      distance: 10,
      timeMinutes: 0,
      timeHours: 10,
      timeDays: 0,
      timeWeeks: 0,
      timeStanding: 0,
      airport: false
    };

    var clearRental = function(currenttab) {
      var now = new moment().startOf('hour').add(1, 'h');

      var rental = {
        tab: currenttab,
        startDate: now.clone(),
        endDate: now.clone(),
        distance: 0,
        timeMinutes: 0,
        timeHours: 0,
        timeDays: 0,
        timeWeeks: 0,
        timeStanding: 0,
        airport: false
      };

      angular.copy(rental, this.rental);
    };

    return {
      rental: rental,
      clearRental: clearRental
    };
  });

Controller :

c2gdtp.js

angular.module('c2gyoApp')
  .controller('SmdtpCtrl', [
    '$scope',
    'stadtmobilRates',
    'smConfig',
    'duration',
    'state',
    function($scope, stadtmobilRates, smConfig, duration, state) {
      $scope.rental = state.rental;
      $scope.clear = function() {
        state.clearRental($scope.rental.tab);
      };
      ...
    }
  ]);

Answer 1

$scope.rental = {
        tab: $scope.rental.tab,

这会将一个新对象分配给 $scope.rental，该对象与 state.rental 没有关联。

angular.copy($scope.rental)

基本上什么也不做。您需要分配回更改:

angular.copy($scope.rental, state.rental);

当然，更干净的解决方案是使用由 Controller 调用的 state.clearRental 方法。

编辑

至于更清洁的解决方案:

clearRental: function() {
    var now = new moment().startOf('hour').add(1, 'h');

    var rental = { ...};
    angular.copy(rental, this.rental);

$scope.clear = function() {
    state.clearRental();
};