Geek asks and answers

AngularJS: make data received with $ http inside the factory accessible inside the controller

I have a factory called "Server" that contains my methods of interacting with the server (get / put / post / delete ..). I managed to log in and get all the data when I had all my code in the controller. Now that I want to split this code and rebuild it a bit, I am running into problems. I can still log in and I also receive data, but the data is just printed; I'm not sure how to access the data in the controller? I saw some “. Then” instead of “.success” used here and there over the Internet, but I don’t know how.

This is my factory: (included in services.js)

app.factory('Server', ['$http', function($http) {
    return {
        // this works as it should, login works correctly
       login: function(email,pass) {
            return $http.get('mywebapiurl/server.php?email='+email+'&password='+pass').success(function(data) {
                console.log("\nLOGIN RESPONSE: "+JSON.stringify(data));
                if(data.Status !== "OK")
                   // login fail
                   console.log("Login FAIL...");
                else
                   // success   
                   console.log("Login OK...");
                });
        },

        // intentional blank data parameter below (server configured this way for testing purposes)
        getAllData: function() {
            return $http.get('mywebapiurl/server.php?data=').success(function(data) {
                console.log("\nDATA FROM SERVER: \n"+data); // here correct data in JSON string format are printed
            });
        },
    };

}]);

This is my controller:

app.controller("MainController", ['$scope', 'Server', function($scope, Server){ 

   Server.login();   // this logins correctly   

   $scope.data = Server.getAllData(); // here I want to get data returned by the server, now I get http object with all the methods etc etc.

  …. continues …

, $http factory ? .

, , . , , , ?

EDIT: factory ng-click, . :

// this is a method in controller
$scope.updateContacts = function(){
    $http.get('mywebapiURL/server.php?mycontacts=').success(function(data) {
        $scope.contacts = data;
    }); 
};

ng-click = "updateContacts()". , $scope.contacts . .then? ( )

:

, , ( ), , . AngularJS? , , ...

+3
2

, , .

$http , , .

:

var deferred = $q.defer();
$http.get(productsEndpoint).success(function(result) {
    deferred.resolve(result);
}).error(function(result) { deferred.reject(result); });
return deferred.promise;

Angular $q . $http , . :

app.controller("myController", ["$scope", "myService", function($scope, myService) {
    $scope.data = { status: "Not Loaded." };
    myService.getData().then(function(data) { $scope.data = data; });
}]);

( , ).

: , , , , . : http://jsfiddle.net/HhFwL/

, OData .

$http: http://docs.angularjs.org/api/ng.%24http $q: http://docs.angularjs.org/api/ng.%24q

+3

$ http.get reconfigures the HttpPromise object

 Server.getAllData().then(function(results){

   $scope.data = results;
 })
0
source

More articles:


All Articles