title: Why my $scope attributes keep resetting in my AngularJS application?
body: <p>I have the following AngularJS application composed of a template (<code>index.html</code>), an app definition (<code>app.js</code>), a controller definition (<code>controllers.js</code>) and a hosting page (<code>host.jsp</code>).</p>
  
  <p>The code is as follows:</p>
  
  <p>search.jsp</p>
  
  <pre><code>&lt;div class="container-fluid" ng-app="facetedSearch"&gt;
      &lt;div class="row-fluid" ng-view&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  &lt;script src="//ajax.googleapis.com/ajax/libs/angularjs/1.0.3/angular.min.js"&gt;&lt;/script&gt;
  &lt;script src="/resources/js/page/search/app.js"&gt;&lt;/script&gt;
  &lt;script src="/resources/js/page/search/controllers.js"&gt;&lt;/script&gt;
  </code></pre>
  
  <p>app.js</p>
  
  <pre><code>angular.module('MyApp', []).
    config(['$routeProvider', function($routeProvider) {
    $routeProvider.
       when('/', {templateUrl:'/index.html', controller: MyController}).
       otherwise({redirectTo: '/'});
  }]);
  </code></pre>
  
  <p>controller.js</p>
  
  <pre><code>var MyController=['$scope','$http','$location',function ($scope, $http, $location) {
     //do some fancy stuff
     if($scope.myAttribute===undefined){
        $scope.myAttribute=someDataFromHttpRequest;
     }
     $location.search(someParameters);
  }];
  </code></pre>
  
  <p>index.html and host.jsp are not shown for brevity and their irrelevance.</p>
  
  <p>The controller gets some data from Ajax request, stores some of it in the <code>$scope</code> to avoid requesting it again and the shows it to the user and waits for input. When the user selects some data in the view, I update URL query part to reflect selection changes. But I want to avoid subsequent Ajax requests by checking if the data is available in the <code>$scope</code>.</p>
  
  <p>The problem I'm facing is that the <code>$scope.myAttribute</code> is always undefined. It resets on every request. I think I'm misusing AngularJS. Any clue?</p>