Skip to content

Instantly share code, notes, and snippets.

@leehsueh
Last active June 23, 2016 10:54
Show Gist options
  • Save leehsueh/aa6e2be1db7f1dc8b37d to your computer and use it in GitHub Desktop.
Save leehsueh/aa6e2be1db7f1dc8b37d to your computer and use it in GitHub Desktop.
Generic Angular API Service with $http
'use strict';
//////////////////////////////////////////////
// Service object to interact with some API //
//////////////////////////////////////////////
angular.module('myApp.services')
.factory('someApi', ['$q', '$http', function($q, $http) {
var endPointUrl = "[some api end point]";
return {
getObjects: function(filterOptions) {
var paramString = filterOptions && $.param(filterOptions) || '';
var deferred = $q.defer();
$http.get(endPointUrl + '/objects?' + paramString)
.success(function(data) {
deferred.resolve(data);
})
.error(function(data, status, headers, config) {
console.log(data);
console.log(status);
console.log(config);
deferred.reject('There was an error fetching objects');
});
return deferred.promise;
},
getObject: function(objectId) {
var deferred = $q.defer();
$http.get(endPointUrl + '/object/' + objectId)
.success(function(data) {
deferred.resolve(data);
})
.error(function(data, status, headers, config) {
console.log(data);
console.log(status);
console.log(config);
deferred.reject('There was an error object');
});
return deferred.promise;
},
createObject: function(data) {
var deferred = $q.defer();
$http.post(endPointUrl + '/object', data)
.success(function(data) {
deferred.resolve(data);
})
.error(function(data, status, headers, config) {
console.log(data);
console.log(status);
console.log(config);
deferred.reject('There was an error creating object');
});
return deferred.promise;
},
updateObject: function(objectId, data) {
var deferred = $q.defer();
$http.put(endPointUrl + '/object/' + objectId, data)
.success(function(data) {
deferred.resolve(data);
})
.error(function(data, status, headers, config) {
console.log(data);
console.log(status);
console.log(config);
deferred.reject('There was an error updating object');
});
return deferred.promise;
},
deleteObject: function(objectId) {
var deferred = $q.defer();
$http['delete'](endPointUrl + '/object/' + objectId)
.success(function(data) {
deferred.resolve(data);
})
.error(function(data, status, headers, config) {
console.log(data);
console.log(status);
console.log(config);
deferred.reject('There was an error deleting object');
});
return deferred.promise;
}
};
}]);
'use strict';
//////////////////////////////////////////
// Controller consuming the API service //
//////////////////////////////////////////
angular.module('myApp.controllers')
.controller('SomeController', ['$scope', 'someApi', function($scope, someApi) {
$scope.objects = [];
$scope.updateList = function() {
someApi.getObjects().then(function(list) {
$scope.objects = list;
}, function(errorReason) {
// what's the best way to handle/communicate
// errors from a serivce to a controller?
// should services abstract http errors and wrap them
// as something else for controllers?
console.log(errorReason);
})
}
}])
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment