AngularJS - $http & $resource Services

2. Constructor
Instance

5. $http({ method: 'GET', url: '/someUrl' })
.success(function (data, status, headers, config) {
// this callback will be called asynchronously
// when the response is available
})
.error(function (data, status, headers, config) {
// called asynchronously if an error occurs
// or server returns response with an error status.
});

6. $http.get('/someUrl').success( successCallback );
$http.post('/someUrl', data).success( successCallback );

8. angular.module('MyApp', []).
config(function ($httpProvider) {
// Remove the default AngularJS X-Request-With header
delete $httpProvider.defaults.headers.common['X-Requested-With'];
// Set DO NOT TRACK for all Get requests
$httpProvider.defaults.headers.get['DNT'] = '1';
});
$http.get('api/user', {
// Set the Authorization header. In an actual app, you would
// get the auth token from a service.
headers: {'Authorization': 'Basic Qzsda231231'},
params: {id: 5}
}).success(function() { // Handle success });

9. function (d) {
return isObject(d) && !isFile(d) ? toJson(d) : d; }
function (data) {
if (isString(data)) {
// strip json vulnerability protection prefix
data = data.replace(PROTECTION_PREFIX, '');
if (JSON_START.test(data) && JSON_END.test(data))
data = fromJson(data);
}
return data;
}

10. // register the interceptor as a service
$provide.factory('myHttpInterceptor', function ($q, dependency1, dependency2) {
return function (promise) {
return promise.then(function (response) { // do something on success
return response;
},
function (response) {
// do something on error
if (canRecover(response)) { return responseOrNewPromise }
return $q.reject(response);
});
}
});
$httpProvider.responseInterceptors.push('myHttpInterceptor');
// register the interceptor via an anonymous factory
$httpProvider.responseInterceptors.push(function ($q, dependency1, dependency2) {
return function (promise) { // same as above }
});

11. $http.get('http://server/myapi', {
cache: true
}).success(function() { // Handle success });

12. $http({
method: string,
url
: string,
params: object,
data : string or object,
headers: object,
// or an array of functions.
transformRequest: function transform(data, headersGetter),
// or an array of functions.
transformResponse: function transform(data, headersGetter),
cache: boolean //or Cache object,
timeout: number,
withCredentials: boolean
});

16. $resource( url [, paramDefaults] [, actions] );

17. Resource
Constructor
Resource Factory
var User = $resource('/user/:userId', { userId: '@id' });
var user = User.get({ userId: 123 }, function () {
user.abc = true;
Resource
Instance
user.$save();
});
Prototype
method
Success
callback

18. 



action – {string} – The name of action.
Method – GET,POST,DELETE & JSONP
Params - Optional set of pre-bound parameters for this action.
isArray - bool

19. Constructor
Resource Constructor
{ 'get'
:
'save' :
'query' :
'remove':
'delete':
{method:'GET' },
{method:'POST'},
{method:'GET', isArray:true},
{method:'DELETE'},
{method:'DELETE'} };
Resource
Constructor
var User = $resource('/user/:userId');
Resource Factory

20. User.get
( paramsObj, successFn, errorFn );
User.query ( paramsObj, successFn, errorFn );
// With Data Object
User.save
(paramsObj, dataObj, successFn, errorFn );
User.remove(paramsObj, dataObj, successFn, errorFn );
User.delete(paramsObj, dataObj, successFn, errorFn );

21. var promise =
$http(httpConfig)
.then(function
function
.then(function
function
value.$promise = promise;
value.$resolved = false;
return value;
The request
details
success(response) { },
error(respones) { })
responseInterceptor(response) { },
responseErrorInterceptor(response) { });
Resource
Instance

22. Instance Structure
var card = Card.get( function () { card.name = "value";
card.$save(); });

23. Instance vs. Constructor
var User = $resource('/user/:userId', { userId: '@id' });
var user = User.get({ userId: 123);
user.$delete();
Users.delete( {} , user);
user.$remove()
Users.remove( {} , user )
user.$save();
Users.save( user );

25. eyalvardi.wordpress.com