title: Unable to reset a $scope variable with angularjs
body: <p>I have a factory that is injected into all of my controllers to initialize and store the state.</p>
  
  <p><strong>state.js</strong></p>
  
  <pre><code>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
        }
      };
    });
  </code></pre>
  
  <p>The start of every controller looks like this</p>
  
  <p><strong>c2gdtp.js</strong></p>
  
  <pre><code>angular.module('c2gyoApp')
    .controller('C2gdtpCtrl', [
      '$scope',
      'c2gConfig',
      'duration',
      'state',
      function($scope, config, duration, state) {
        $scope.rental = state.rental;
        ...
      }
    ]);
  </code></pre>
  
  <p>This works just as intendend throughout the different controllers. Every change made to the <code>$state.rental</code> object is kept through different views/controllers.</p>
  
  <p>I've implemented a <code>clear()</code> function in a directive that is used by every controller:</p>
  
  <p><strong>timeinputform.js</strong></p>
  
  <pre><code>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);
          };
  
        }
      };
    });
  </code></pre>
  
  <p>Problem is it doesn't save the reset of the <code>$state.rental</code> object. For example, if I'm in view1/controller1 and click the clear button, the <code>$state.rental</code> object is reset. If I change onto view2/controller2 I have the same old values as before I clicked the clear button. If I then go again to view1/controller1, I also have the same old values from before, although I clicked the clear button.</p>
  
  <p>The <code>clear()</code> function is in the directive because that's where the clear button is located. I've tried copying the <code>clear</code> function into the controllers, with the same result.</p>
  
  <p>I just want to clear the state throughout all the controllers. What's the trick for this?</p>
  
  <p><em>edit</em> @zeroflagL How would a clean solution look like? I've tried setting up the clearRental function in the factory:</p>
  
  <p><em>edit#2</em> My final solution. The tab value has to stay the same, and I couldn't take it out of the <code>$scope</code> anymore in the factory. Now it's being passed on.</p>
  
  <p><strong>state.js</strong></p>
  
  <pre><code>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
      };
    });
  </code></pre>
  
  <p>the controllers:</p>
  
  <p><strong>c2gdtp.js</strong></p>
  
  <pre><code>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);
        };
        ...
      }
    ]);
  </code></pre>