2016-05-15 8 views
0

ng-repeat in md-sidenav

<md-list> 
     <md-list-item ng-repeat="it in cars"> 
       {{ it.name }} 
     </md-list-item> 
</mdlist> 

Auto-Controller

self.refreshUI = function(select) { 

     carService.getAllCars() 
      .then(function (res) { 

       $scope.cars = carService.carsList; 
       console.log($scope.cars); 


      }, function (err) { 
       //error 
      }) 

    }; 

    // Load all registered cars 
    self.refreshUI(null); 

Above Code ausgeführt wird, wenn die Steuerung (letzte Zeile) geladen wird, und es funktioniert gut. Aber wenn ich ein neues Auto erstelle (Autos werden in mysql db gespeichert) und ich will $ scope.cars array durch die Funktion self.refreshUI() aktualisieren, wird es nicht funktionieren, bis die Seite aktualisiert wird.

console.log($scope.cars) aus refreshUI Funktion korrektem Ergebnis kehrt aber console.log(angular.element($0).scope().cars) gibt falsche Array (ohne neue Autos)

Car Service

function carService($q, $http) { 

     var cars = this; 
     cars.carsList = {}; 

     cars.getAllCars = function() { 
      var defer = $q.defer(); 

      $http.get("http://car.app/getCars") 
       .success(function(res) { 
        cars.carsList = res; 
        defer.resolve(res); 
       }) 
       .error(function(err, status){ 
        defer.reject(err); 
       }); 

      return defer.promise; 

     }; 

     return cars; 
} 

Wo könnte das Problem sein?

// edit: $ rootScope funktioniert gut, aber ich möchte noch $ Umfang

+0

Sind Sie 100% sicher, dass die Autos Umfang in der rechten ng-Controller ist – Fergus

+0

ich ziemlich sicher bin Zyklus ein verdauen soll auf .resolve Aufruf zu feuern, aber nur um sicherzustellen, dass, wenn Sie einen "$ scope. $ apply()" werfen, nachdem Sie die Variable $ scope.cars gesetzt haben, wird es korrekt aktualisiert? Ich sage nicht, dass dies die richtige Lösung ist, sondern eher ein Debugging-Vorschlag. – sourdoughdetzel

+0

Es gibt nur einen Controller und $ scope. $ Apply() gibt mir den Fehler "$ digest is in progress" – user3364397

Antwort

3

Warum verwenden sind nicht Sie zurück Versprechen als Ergebnis aus dem Aufruf $http verwenden? Neben einem besseren Code-Stil könnte es Ihr Problem lösen. Mit dieser Art von Service-Controller-Infrastruktur hatte ich nie "bindende Probleme".

function carService($q, $http) { 

    var cars = this; 
    cars.carsList = {}; 

    cars.getAllCars = function() { 
     return $http.get('http://car.app/getCars').then(function (response) { 
      cars.carsList = response.data; 
      return response.data; 
     }); 
    }; 

    return cars; 
} 

In Ihrem Controller kann man dann so etwas tun:

self.refreshUI = function() { 

    carService.getAllCars() 
     .then(function (data) { 
      // just obtain the promise data 
      $scope.cars = data; 
     }, function (err) { 
      // error handling 
     }); 

}; 

self.refreshUI(); 
+0

Ich habe es so versucht und auch ohne Service und immer noch Probleme. – user3364397

+0

Können Sie diese Probleme definieren? Gibt Ihre Browser-Konsole eine Ausgabe? Haben Sie versucht, das Ergebnis des $ http-Aufrufs an der Konsole zu protokollieren? – jverhoelen

+0

Wenn das Ergebnis dort angezeigt wird, versuchen Sie, dies über den Service-Anruf im Controller zu protokollieren. Protokollieren Sie außerdem die Fehlerfunktionen, um zu überprüfen, ob sie ausgeführt werden, um festzustellen, ob die HTTP-Anforderung nicht OK ist. – jverhoelen