$http GET array of objects from an api

Question

Below is my AirTableService.js

(function () {
    "use strict";   
    var AirTableService = function ($http, $q) {
        var AirTableMethods = {
            getMyRounds: function(AirTable_secret){
                var deferObject_myRounds;
                var myRounds_promise = $http.get('https://api.airtable.com/v0/XXXXXXX/Rounds?view=Main%20View&maxRecords=10&callback=JSON_CALLBACK', {
                    headers : {
                        'Authorization' : AirTable_secret.apikey,
                        'Content-Type' : 'application/json'
                    }
                });
                deferObject_myRounds = deferObject_myRounds || $q.defer();

                myRounds_promise.then(function(data){
                    deferObject_myRounds.resolve(data);
                });                
                return deferObject_myRounds.promise;
            }
        };
        return AirTableMethods;
    };

    AirTableService.$inject = ['$http', '$q'];

    angular.module('appGolf')
      .service('AirTableService', AirTableService);

}());

In there as you can see, using AirTable's api I am trying to GET data from my table. I'm passing the parameters view and maxRecords and it works. Documentation states I can pass sort,

which I then changed to,

https://api.airtable.com/v0/XXXXXXX/Rounds?view=Main%20View&maxRecords=10&sort=[{field:'RoundID',direction:'desc'}]&callback=JSON_CALLBACK

and clearly that doesn't work and it it gives me this error,
I know this is because sort is a array of objects and I know how I am passing this is incorrect.

My question is, how do you do this in AngularJS?

Thank you in advance.

Possible duplicate of [Send array via GET request with AngularJS' $http service](http://stackoverflow.com/questions/19957858/send-array-via-get-request-with-angularjs-http-service) — Jon B, May 03 '16 at 14:14
`$http` already returns a promise. You don't have to use `$q`. — Kyle, May 03 '16 at 14:20
your error message shows an extra single quote after 'desc', you didn't add that by mistake, right? — DrewJordan, May 03 '16 at 14:30

score 2 · Accepted Answer · edited May 23 '17 at 12:01

Found the answer here As mentioned there, I needed to add,

paramSerializer: '$httpParamSerializerJQLike',

And if you are interested, my function now looks like,

var myRounds_promise = $http.get('https://api.airtable.com/v0/XXXXX/Rounds?callback=JSON_CALLBACK', {
                params: {
                    view: 'Main View',       
                    maxRecords: 10,
                    sort: [{"field": 'RoundID', "direction":'desc'}]                        
                },
                paramSerializer: '$httpParamSerializerJQLike',                    
                headers : {
                    'Authorization' : AirTable_secret.apikey,
                    'Content-Type' : 'application/json'
                }
            });

Thanks everyone for their suggestions and helping me out.

Kyle · Answer 2 · 2016-05-03T14:36:21.897

Your service is very verbose and hard to read. I would write it like this:

var app = angular.module("myApp", [ /* dependencies */ ]);

app.factory("AirTableService", ["$http", function($http) {
    return {
        getMyRounds: function(AirTable_secret) {
            return $http.get('path/to/API', {
                //put your sorting JSON object here in params
                params: { sort: [{field: "RoundID", direction: "desc"}] },
                headers: {
                    'Authorization' : AirTable_secret.apikey,
                    'Content-Type' : 'application/json'
                }
            });
        },
        anotherMethod: function() {
            //etc....
        },
        yetAnotherMethod: function() {
            return $http.post(); //maybe POST something
        }
    };
}]);

Inject it to your controller and use:

AirTableService.getMyRounds(airtableSecret).then(successCallback).catch(errorCallback);

I tried as you suggested but still getting the same error. BTW appreciate formatting my service, it makes sense. — MadushM, May 03 '16 at 16:52

$http GET array of objects from an api

2 Answers2