2014-02-24 4 views
5

내 컨트롤러에서 .factory를 사용하여 만든 서비스를 호출 할 때 문제가 있습니다. 코드는 다음과 같습니다. 공장 (app.js) :컨트롤러 팩토리에 대한 서비스 호출

.factory('Database',function($http){ 

    return { 

     getDatabase: function(){ 

     var database = {}; 

     $http.get('http://localhost:3001/lookup'). 
      success(function(data){ 

      database.companyInfo = data.info.companyInfo; 
      }); 


      }). 
      error(function(data){ 
      console.log('Error' + data); 
      }); 

     return database; 

     } 
    }; 
    }) 

컨트롤러 : 나는 방화범 요소를 검사 할 때

angular.module('webClientApp') 
    .controller('MainCtrl', function (Database,Features,$scope,$http) { 




     $scope.databaseString = []; 
     $scope.quarters = ['Q1','Q2','Q3','Q4']; 
     $scope.years = ['2004','2005','2006','2007','2008','2009','2010', 
     '2011','2012','2013','2014']; 
     $scope.features = Features.getFeatures(); 
     $scope.database = Database.getDatabase(); 

     console.log($scope.database); 

지금 내가 얻을 GET 문 결과 전에 인쇄 된 console.log($scope.database). $scope.database은 모든 소유권이있는 Object {}으로 표시됩니다. 그러나 console.log($scope.database.companyInfo)을 사용하려고 시도하면 결과적으로 undefined이 발생하지만 그 대신 data.info.companyInfo' that I passed from the 데이터베이스`서비스 (이 경우 배열)를 가져와야합니다.

무엇이 문제입니까? 누군가 나를 도울 수 있습니까? 가 (당신이 해명이 필요하면 알려 주시기 바랍니다 ..)

+2

'$ http.get'이 ** 비동기입니다 :

.factory('Database',function($http){ return { getDatabase: function(onSuccuess,onFailure){ var database = {}; $http.get('http://localhost:3001/lookup'). success(onSuccess). error(onFailure); } }; }) 

이 컨트롤러 코드가 될 것이다 :이 서비스가 될 것입니다. 그래서'console.log ($ scope.database)'가 GET 문 앞에 출력 될 때 –

+0

결과가 나옵니다. 고맙습니다! 그러나 $ http.get의 비동기를 처리하는 방법이 있습니까? $ document.ready()와 같은가요? – user1718064

+1

콜백을 전달하거나 함수에서 약속을 반환 할 수 있습니다. –

답변

7

$ http.get() 호출은 비동기이며 promise 객체를 사용합니다. 따라서 제공된 코드를 기반으로 성공 메서드가 서비스에서 실행되기 전에 $ scope.database를 출력 할 가능성이 높습니다.

모든 서비스 메소드를 빌드하여 성공 또는 실패 기능을 전달합니다. **

angular.module('webClientApp') 
    .controller('MainCtrl', function (Database,Features,$scope,$http) { 


$scope.databaseString = []; 
$scope.quarters = ['Q1','Q2','Q3','Q4']; 
$scope.years = ['2004','2005','2006','2007','2008','2009','2010', 
     '2011','2012','2013','2014']; 
$scope.features = Features.getFeatures(); 
Database.getDatabase(successFunction,failureFunction); 

successFunction = function(data){ 
    $scope.database = data.info.companyInfo; 
    console.log($scope.database); 
}); 

failureFunction = function(data){ 
    console.log('Error' + data); 
} 
3

는 다음과 같은 방법으로 코드를 변경합니다

.factory('Database',function($http){ 
    return { 
    getDatabase: function(){ 
     return $http.get('http://localhost:3001/lookup'); 
    } 
    }; 
}) 

그런 다음 컨트롤러에서 응답을 (약속 체인)

Database.getDatabase() 
    .then(function(data){ 
     //assign value 
    }) 
    .catch(function(){ 
    }) 
관련 문제