title: Data not showing on new page
body: <p>I have created a web service that has 2 methods, general and details. General shows basic data whereas the details provides further details on the selected object. I am finding difficulties in loading the new page with details showing.</p>
  
  <p>These are the angular methods I've created.</p>
  
  <pre><code>var app = angular.module("myModule", .....);
  
  var app = angular.module("myModule2", [])
                      .controller("myController2", function ($scope, $http) {
  
                          $scope.test = "DetailsScript";
  
                          //method to get booking by reference start
                          $scope.getReference = function (Reference) {
  
                              $http({
                                  method: 'GET',
                                  url: 'http://localhost:3466/MyWebService.asmx/DashboardDetail',
                                  params: {
                                      Reference: Reference
                                  }
                              }).then(function (response) {
                                  $scope.booking = response.data
                              });
                          };
                          //method to get booking by reference end
  
                          //method to load page start
                          $scope.loadView = function (ref) {
                              var url = 'DetailsPage.html';
                              $scope.getReference(ref);
                              window.location(url);
                          };
                          //method to load page end
                      });
  
  angular.module("CombineModule", ["myModule", "myModule2"]);
  </code></pre>
  
  <p>When I click the following buttin I cannot seem to get the details to go to the new page:</p>
  
  <pre><code>&lt;input id="refBox" type="text" ng-model="Reference" ng-change="getReference(Reference)" /&gt;
              &lt;br /&gt;
              &lt;input type="button" ng-click="loadView(Reference)" /&gt;
  </code></pre>
  
  <p>The ng-click simply takes me to the new page without the new data loaded.</p>
  
  <p>My web service gets called correctly and returns the correct <code>Context.Response.Write(javascriptserializer.Serialize(myObject));</code></p>
  
  <p>There may be two problem: The page is loaded and displayed before the data is returned as it is asynchronous, and if that is the case, why? as the loadView calls getReference which has the .then function?</p>
  
  <p>P.s. I am new to angularjs.</p>