1. www.luxoft.com AngularJS $resource service

2. www.luxoft.com Add angular-resouce: Add the dependency: angular.module('myApp', ['ngResource']); Configure Angular to use $resource

3. www.luxoft.com With $http: $http.get('/users/’).success(function(result) { $scope.users = result.data; }); With $resource:.factory('UserService', function ($resource){ return $resource(‘/users/:id', {id: "@userId"}); }); Retrieve users in controller: $scope.users = UserService.query(); Retrieving user data

4. www.luxoft.com $resource methods: { 'get': {method:'GET'}, 'save': {method:'POST'}, 'query': {method:'GET', isArray:true}, 'remove': {method:'DELETE'}, 'delete': {method:'DELETE'} }; Resource get with parameter: $scope.oneUser = UserService.get({userId: 1}); The resource object will replace the :user with our given id: GET http://localhost/user/1 $resource methods

5. www.luxoft.com Resource POST: UserService.save({ name: 'Saimon', email: 'saimon@devdactic.com'}); POST http://localhost/user Name=Saimon&email=saimon@devdactic.com Resource get with 2 parameters: $scope.oneUser = UserService.get( {userId: 1, name: ’John'}); GET http://localhost/user/1?name=John Extending resource to support PUT

6. www.luxoft.com.factory('UserService', function ($resource) { var data = $resource(‘/users/:id', {id: '@userId'}, { update:{method:'PUT’} }); return data; }); UserService.update({userId: 1}, { name: 'Saimon', email: 'saimon@devdactic.com'}); PUT http://localhost/users/1 name=Saimon&email=saimon@devdactic.com Extending resource to support PUT

7. www.luxoft.com var query = UserService.query(); query.$promise.then(function(data) { $scope.users = data; // Do whatever when the // request is finished }); Also available as a callback: UserService.query(function(data) { $scope.users = data; }); Using $resource with promises

8. www.luxoft.com Working with instances // define User service var User = $resource("/users/:id”, {id:"@userId"} // find and save user User.get({userId:123}, function(user) { user.age = 25; user.$save(); // POST /users/123 }); // add new user var newUser = new User(); user.name="John"; user.$save(); // POST /users // remove user by id var user = User.get({userId:123}, function() { user.$remove(function() { console.log("user "+user.name+" was removed"); }); }

9. www.luxoft.com GET /booking/ — Gets all bookings GET /booking/1 — Gets the booking with ID 1 POST /booking/ — Creates a new booking PUT /booking/1 — Update booking with ID 1 DELETE /booking/1 — Delete booking with ID 1 GET /booking/?reviews=true - Get all bookings having reviews GET /booking/1?details=true - Get the detailed info for the booking Example: REST API for bookings

10. www.luxoft.com service.factory( "Booking", function($resource) { return $resource("/booking/:id", null, // Parameter name is id – not override { "update": { method: "PUT" }, "reviews": { method: "GET", params: {reviews:"true"}, isArray: true }, "details": { method: "GET", params: {details:"true"} } ); }); Define Booking Resource

11. www.luxoft.com // Get Reviews var bookingWithReviews = Booking.reviews(); // Calls: GET /booking/?reviews=true // Get Booking with ID=1: GET /booking/1 var booking = Booking.get({'id': 1}, function() { // Change some value in booking booking.fees = 34; // Save the changes (update it) booking.$update(); // Calls: PUT /booking/1 var detailedBookingInfo = booking.$details(); // Calls: GET /booking/1?details=true booking.$remove(); // Calls: DELETE /booking/1 } Making REST calls to booking service