更新配列$ httpの後、要求がMD-sidenavに

Question

NGリピートを働いていない

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

は

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); 

コードの上の車コントローラが実行されます（最後の行）、それが正常に動作しています。しかし、私は新しい車（車はmysqlのDBに格納されている）を作成し、self.refreshUI（）関数で$ scope.cars配列を更新したいときは、ページmannualyをリフレッシュするまで動作しません。 （新車なし）

カーサービス問題になる可能性が

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; 
} 

をrefreshUI機能から

console.log($scope.cars)は正しい結果を返しますがconsole.log(angular.element($0).scope().cars)は間違った配列を与えますか？

//編集：$ rootScopeが正常に動作していますが、$httpコールから結果として返さ約束を使用していないのはなぜ私はまだ$スコープ

Answer 1

を使いたいですか？より良いコードスタイルのほかに、あなたの問題を解決することができます。そのような種類のサービスコントローラーインフラストラクチャーでは、私は決してそのような「拘束力のある問題」を持っていませんお使いのコントローラで

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; 
} 

あなたは、そのような何かを行うことができます：

self.refreshUI = function() { 

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

}; 

self.refreshUI();