Angular-Data is an AngularJS library that provides a full API for CRUD operations and querying REST APIs. It features built-in caching, automatic data binding, and model definition capabilities. Angular-Data abstracts away low-level HTTP calls and provides a higher-level interface for consuming RESTful APIs in AngularJS applications.

1. ANGULAR DATA

2. by Stefan Unterhofer
Cloud Engineer @indoo.rs

3. CONSUMING REST APIS
IN
ANGULARJS

4. $HTTP
Extremely low-level
No common interface
function AbstractController($http) {
$http.get().then(...); // can't do this :(
}

5. $RESOURCE & RESTANGULAR
Full REST abstraction
Interfaces
Support for custom model classes
Support for custom methods
Restangular can do more complex things

6. HOMEMADE API SERVICE
Was viable half a year ago
Features normally put into such a service are supported by $resource
and Restangular
Don't use it unless you have some very special use cases

7. MEET
ANGULAR-DATA

8. INSPIRED BY EMBER DATA

9. FULL API FOR CRUD AND
QUERYING

10. BUILT-IN CACHING

11. DEFINE A RESOURCE
module.factory('Todo', function(DS) {
return DS.defineResource('todos');
})
.controller('TodoCtrl', function(Todo) {
// dependency injection, yay!
}

12. ASYNCHRONOUS DATA ACCESS
// load single object
Todo.find(123).then(function(data) {
$scope.todo = data;
}
// query for multiple objects
Todo.findAll({ /* this can be a query */ }).then(function(data) {
$scope.todos = data;
}
});
These methods will hit the server if there is no data in the cache.

13. SYNCHRONOUS DATA ACECSS
// load one
$scope.todo = Todo.get(123)
// query for multiple
$scope.todos = Todo.filter({ /* query */ })
These methods will only hit the cache

14. CREATE, UPDATE, DELETE
// create an object
Todo.create({done: false, task: 'Buy Milk'});
// update an object
Todo.save({id: 123, done: true, task: 'Buy Milk'});
// delete an object
Todo.delete(123);
All of these return promises
Cache is automatically updated locally

15. DATA BINDING
// this will update the 'todos' collection automatically if there are changes to it
Todo.bindAll($scope, 'todos', /* query */ );
// short form for
$scope.$watch(function() {return Todo.lastModified()}, function(newVal) {
$scope.todos = newVal;
});
// bind a single object
Todo.bindOne($scope, 'todo', 123);
Bound objects / collections will be automatically updated on data
manipulation

16. FILTERING
Angular-Data brings its own filter format
var params = { where: { author: { '==': 'John Anderson' }}};
DS.findAll('post', params).then(...)
Custom filters can be implemented if server does not support this api
Filtering logic on server & angular-data must match!

17. MODEL DEPENDENCIES
// define relations
DS.defineResource({
name: 'user',
relations: {
hasMany: { // supports hasMany, hasOne, belongsTo
comment: {
localField: 'comments',
foreignKey: 'userId'
}
}
}
});
DS.get('user', 1); // this will load the user and all of his comments

18. MODEL LIFECYCLE
DS.defineResource({
name: 'document',
beforeDestroy: function (resourceName attrs, cb) {
console.log('looks good to me');
cb(null, attrs);
},
afterDestroy: function(...){ /* called after an object was deleted */ },
beforeValidate: function(...){ /* called before validation */ },
validate: function(...){ /* here you can validate your model */},
afterValidate: function(...){ /* called after validation */ },
beforeCreate: function(...){ /* called before http post */ },
afterCreate: function(...){ /* called after object was created */ },
beforeUpdate: function(...){ /* called before http put */ },
afterUpdate: function(...){ /* called after object was updated */ },
beforeInject: function(...){ /* called before an object is injected in the store/cache */},
afterInject: function(...){ /* called after an object was injected into the store/cache */}
});

19. OTHER FEATURES
▸ Caching
With angular $cacheProvider or Angular-Cache
Angular-Cache supports expiry and local storage
▸ Custom Adapters
▸ Custom Methods

20. http://angular-data.pseudobry.com/

21. https://github.com/fewagewasd/ng-meetup-angular-data