Switch to angular-resource

Author: kaidokert

examples/angularjs/index.html

@@ -66,6 +66,7 @@ <h1>todos</h1>
 		<script src="node_modules/todomvc-common/base.js"></script>
 		<script src="node_modules/angular/angular.js"></script>
 		<script src="node_modules/angular-route/angular-route.js"></script>
+		<script src="node_modules/angular-resource/angular-resource.js"></script>
 		<script src="js/app.js"></script>
 		<script src="js/controllers/todoCtrl.js"></script>
 		<script src="js/services/todoStorage.js"></script>

examples/angularjs/js/app.js

@@ -5,7 +5,7 @@
  *
  * @type {angular.Module}
  */
-angular.module('todomvc', ['ngRoute'])
+angular.module('todomvc', ['ngRoute', 'ngResource'])
 	.config(function ($routeProvider) {
 		'use strict';
 

examples/angularjs/js/services/todoStorage.js

@@ -21,12 +21,18 @@ angular.module('todomvc')
 			});
 	})
 
-	.factory('api', function ($http) {
+	.factory('api', function ($resource) {
 		'use strict';
 
 		var store = {
 			todos: [],
 
+			api: $resource('/api/todos/:id', null,
+				{
+					update: { method:'PUT' }
+				}
+			),
+
 			clearCompleted: function () {
 				var originalTodos = store.todos.slice(0);
 
@@ -42,61 +48,45 @@ angular.module('todomvc')
 
 				angular.copy(incompleteTodos, store.todos);
 
-				return $http.delete('/api/todos')
-					.then(function success() {
-						return store.todos;
+				return store.api.delete(function () {
 					}, function error() {
 						angular.copy(originalTodos, store.todos);
-						return originalTodos;
 					});
 			},
 
 			delete: function (todo) {
 				var originalTodos = store.todos.slice(0);
 
 				store.todos.splice(store.todos.indexOf(todo), 1);
-
-				return $http.delete('/api/todos/' + todo.id)
-					.then(function success() {
-						return store.todos;
+				return store.api.delete({ id: todo.id },
+					function () {
 					}, function error() {
 						angular.copy(originalTodos, store.todos);
-						return originalTodos;
 					});
 			},
 
 			get: function () {
-				return $http.get('/api/todos')
-					.then(function (resp) {
-						angular.copy(resp.data, store.todos);
-						return store.todos;
-					});
+				return store.api.query(function (resp) {
+					angular.copy(resp, store.todos);
+				});
 			},
 
 			insert: function (todo) {
 				var originalTodos = store.todos.slice(0);
 
-				return $http.post('/api/todos', todo)
-					.then(function success(resp) {
-						todo.id = resp.data.id;
+				return store.api.save(todo,
+					function success(resp) {
+						todo.id = resp.id;
 						store.todos.push(todo);
-						return store.todos;
 					}, function error() {
 						angular.copy(originalTodos, store.todos);
-						return store.todos;
-					});
+					})
+					.$promise;
 			},
 
 			put: function (todo) {
-				var originalTodos = store.todos.slice(0);
-
-				return $http.put('/api/todos/' + todo.id, todo)
-					.then(function success() {
-						return store.todos;
-					}, function error() {
-						angular.copy(originalTodos, store.todos);
-						return originalTodos;
-					});
+				return store.api.update({ id: todo.id }, todo)
+					.$promise;
 			}
 		};