Angular $http.get request not running success or error functions

Question

I am trying to make a get request to the nutritionix v1_1 api. When debugging I can see that the function is successfully called and the correct data is passed in. When the function hits the $http.get request it skips over the rest of the code(the .success and .error parts), and it doesn't return the promise. I know the request is good because I have made successful requests using postman. I have the request written like:

(This method is inside of a factory. It is later called from a controller.)

let getNutrients = (foodId) => {
    let authPart =`appId=${NUTRITIONIXAPIKEY.appId}&appKey=${NUTRITIONIXAPIKEY.appKey}`;
    let filter = 'fields=item_name,item_id,brand_name,brand_id,item_type,nf_calories,nf_total_carbohydrate,nf_dietary_fiber,nf_cholesterol,nf_total_fat,nf_sugars,nf_sodium,nf_protein,images_front_full_url,nf_serving_size_qty,nf_serving_size_unit,nf_servings_per_container';
    // let sort = 'sort: {"field":"_score", "order":"desc"}';
    // let typefilter = '"filters":{"not": {"item_type":3}}';
    return (
        $q((resolve,reject) =>{             
            $http.get(`https://api.nutritionix.com/v1_1/item?id=${foodId}&${filter}&${authPart}`)
            .success( (response) => {
                console.log('nutrix response nutrients request', response);
                resolve(response);
            }).error(function(errorResponse){
                console.log('nutrix fail nutrients request', errorResponse);
                reject(errorResponse);
            });
        })
    );
};

here is the factory method call from the controller:

NutrixFactory.getNutrients(foodId).then(function(nutrients){
    console.log('nutrients returned', nutrients);
    // $scope.nutrients = $scope.nutrients || [];
    $scope.nutrients.push(nutrients);
    console.log('nutrients array', $scope.nutrients);
});

http://stackoverflow.com/questions/31193217/angular-js-http-success-vs-q-resolve — Shankar Shastri, Dec 30 '16 at 17:16
@ShankarShastri I don't have a solid answer for that. It's how I was taught to make the request. I think it might have something to do with MVC. I am calling this function from a controller then chaining a .then on the function call to process the returned data. — tks2n, Dec 30 '16 at 17:23
If you watch your network, does the HTTP request actually get made/return? — Daniel, Dec 30 '16 at 17:36
because in angular 1.6 $http.get(url).success is removed.Instead $http.get(url).then is used — Shankar Shastri, Dec 30 '16 at 17:37
https://github.com/angular/angular.js/commit/b54a39e2029005e0572fbd2ac0e8f6a4e5d69014 — Shankar Shastri, Dec 30 '16 at 17:38
@ShankarShastri I'm going to try altering the request by removing the encapsulating $q promise and just returning the response in the .success or .error functions. — tks2n, Dec 30 '16 at 17:39
@Daniel it does make the request but it has a status of pending — tks2n, Dec 30 '16 at 17:42
@tks2n Angular will only run your callbacks once the request completes. You may be looking in the wrong place for your problem... — Daniel, Dec 30 '16 at 17:48
@Daniel I'm looking at the syntax of the angular promise and get request. Where do you think the issue is? — tks2n, Dec 30 '16 at 19:19
@tks2n Well, if your request is getting sent by the client, but never completely returns from the server, it could be in any number of places... Maybe postman is sending a cookie or some kind of authentication that your client isn't, and that's causing the request to stall. Maybe there's something wrong with the enconding or parameters. All I'm saying is that the angular request code might not be the problem, although I do agree with using `.then` — Daniel, Dec 31 '16 at 07:22

score 2 · Accepted Answer · edited Dec 31 '16 at 04:14

try then and catch instated of success and error if its 1.6.*

Deprecation Notice

let getNutrients = (foodId) => {
    let authPart =`appId=${NUTRITIONIXAPIKEY.appId}&appKey=${NUTRITIONIXAPIKEY.appKey}`;
    let filter = 'fields=item_name,item_id,brand_name,brand_id,item_type,nf_calories,nf_total_carbohydrate,nf_dietary_fiber,nf_cholesterol,nf_total_fat,nf_sugars,nf_sodium,nf_protein,images_front_full_url,nf_serving_size_qty,nf_serving_size_unit,nf_servings_per_container';
    // let sort = 'sort: {"field":"_score", "order":"desc"}';
    // let typefilter = '"filters":{"not": {"item_type":3}}';
    return (
        $q((resolve,reject) =>{             
           return $http.get(`https://api.nutritionix.com/v1_1/item?id=${foodId}&${filter}&${authPart}`)
            .then( (response) => {
                console.log('nutrix response nutrients request', response);
                resolve(response);
            }).catch(function(errorResponse){
                console.log('nutrix fail nutrients request', errorResponse);
                reject(errorResponse);
            });
        })
    );
};

Even if it's pre 1.6.x should still use `.then()` and `.catch()` — Baruch, Dec 31 '16 at 04:32

Angular $http.get request not running success or error functions

1 Answers1