Dienst in Angular nicht erfolgreich zurückgegebenen Variablen

Question

So schrieb ich einen Dienst, um die $ http.get Aufrufe durchzuführen und die erforderlichen Variablen, die ich für die Funktionalität meiner Vorlage benötigt. Das Problem, das ich habe, ist, obwohl ich in der Lage bin, die Daten auf der Serverseite zu sehen und zu protokollieren, wenn ich meinen Dienst anrufe und versuche, auf die Variablen zuzugreifen, die er zurückgeben soll.

Mein Service ist wie folgt:

function getResultsPage($http) { 
     var fetchPage = function(pageNumber, filterType, searchVal) { 
      var recordCount; 
      var contactsPage = []; 
      $http.get(
        '/searchTotal?filterType=' + filterType + '&searchVal=' 
          + searchVal).then(function(response) { 
       recordCount = response.data; 
       console.log("recordCount: " + recordCount); 
      }); 
      $http.get(
        '/search?filterType=' + filterType + '&searchVal=' 
          + searchVal + "&pgNo=" + pageNumber).then(
        function(response) { 
         response.data.forEach(function(contact) { 
          contactsPage.push(contact); // load search 
          // results into 
          // contactsPage 
         }); 
        }); 
      return { 
       recordCount : recordCount, 
       contactsPage : contactsPage 
      }; 
     } 
     return { 
      fetchPage : fetchPage 
     }; 
    } 

und meinen Controller:

function ContactsController($http, $filter, getResultsPage) { 
    var self = this; 

    // Begin lazy loading code 
    self.filterType = 'LastName'; 
    self.contactsPage = []; 
    self.recordCount = 0; 
    self.usersPerPage = 15; // this should match however many results your 
    // API puts on one page 
    self.pagination = { 
     current : 1 
    }; 
    self.pageChanged = function(newPage, filterType, searchVal) { 
     self.filterType = filterType; 
     self.recordCount = getResultsPage.fetchPage(newPage, filterType, 
       searchVal).recordCount; 
     console.log("record count in js = " + self.recordCount); 
     self.contactsPage = getResultsPage.fetchPage(newPage, filterType, 
       searchVal).contactsPage; 
     console.log("contactsPage in js = " + self.contactsPage); 
    }; 

    self.pageChanged(1, 'LastName', 'a'); 
    // End lazy loading code 

Hier ist ein Bild der Ausgabe von meinen Log-Anweisungen innerhalb der pageChanged Funktion:

Um zu verdeutlichen: Ich bekomme die 1822 co Ntacts zurück von meiner Abfrage, aber von meinem Controller kann ich nicht diese Nummer, um an self.recordCount zu binden, und ich kann nicht das zurückgegebene Array von Kontakten, um erfolgreich zu binden, auch auf self.contactsPage. Vielen Dank für jede Hilfe!

Answer 1

Mit Blick auf die Protokolle wird das js-Konsolenprotokoll (console.log("record count in js = " + self.recordCount);) zuerst ausgeführt, da der Serviceaufruf asynchron ist. Verwenden Sie eine Rückruffunktion, die die Variablen festlegt, wenn der Dienst zurückgegeben wurde.