Angular js trả về đối tượng không xác định từ nhà máy

Question

Tôi có bộ điều khiển và nhà máy được xác định như bên dưới.

myApp.controller('ListController', 
     function($scope, ListFactory) { 
    $scope.posts = ListFactory.get(); 
    console.log($scope.posts); 
}); 

myApp.factory('ListFactory', function($http) { 
    return { 
     get: function() { 
      $http.get('http://example.com/list').then(function(response) { 
       if (response.data.error) { 
        return null; 
       } 
       else { 
        console.log(response.data); 
        return response.data; 
       } 
      }); 
     } 
    }; 
}); 

Điều làm tôi bối rối là đầu ra của bảng điều khiển của tôi là dòng liệt kê các đối tượng từ nhà máy của tôi. Tôi cũng đã cố gắng thay đổi điều khiển của tôi để

myApp.controller('ListController', 
     function($scope, ListFactory) { 
    ListFactory.get().then(function(data) { 
     $scope.posts = data; 
    }); 
    console.log($scope.posts); 
}); 

Nhưng tôi nhận được lỗi

TypeError: Cannot call method 'then' of undefined 

Lưu ý: Tôi tìm thấy thông tin này về việc sử dụng một nhà máy thông qua http://www.benlesh.com/2013/02/angularjs-creating-service-with-http.html

Answer 1

Bạn cần phải hoặc sử dụng một callback hoặc chỉ cần trả lại trước $http.get...

return $http.get('http://example.com/list').then(function (response) { 
    if (response.data.error) { 
     return null; 
    } else { 
     console.log(response.data); 
     return response.data; 
    } 
}); 

Answer 2

$ http.get là không đồng bộ do đó tại thời điểm bạn cố gắng truy cập nó (bên trong bộ điều khiển của bạn) nó có thể không có dữ liệu (do đó bạn nhận được không xác định).

Để giải quyết điều này tôi sử dụng. Sau đó() sau khi tôi gọi phương thức nhà máy từ bộ điều khiển của mình. nhà máy của bạn sau đó sẽ giống như thế:

myApp.factory('ListFactory', function($http) { 
    return { 
     get: function() { 
      $http.get('http://example.com/list'); 
     } 
    }; 
}); 

Và điều khiển của bạn:

myApp.controller('ListController', function($scope, ListFactory) { 
    ListFactory.get().then(function(response){ 
     $scope.posts = response.data; 
    }); 
    // You can chain other events if required 
}); 

Hy vọng nó giúp