javascript - node - ngresource crud
Ejemplo RESTful de AngularJS $ resource (2)
$ resource tiene como objetivo recuperar datos de un punto final, manipularlo y enviarlo de vuelta. Tienes algo de eso ahí, pero no estás aprovechando lo que está hecho para hacer.
Está bien tener métodos personalizados en tu recurso, pero no quieres perderte las fantásticas funciones que viene con OOTB.
EDITAR : No creo que lo haya explicado suficientemente bien originalmente, pero $resource
hace algunas cosas funky con devoluciones. Todo.get()
y Todo.query()
devuelven el objeto de recurso y lo pasan a la devolución de llamada para cuando finalice. Hace algunas cosas elegantes con promesas entre bastidores que significan que puedes llamar a $save()
antes de que la devolución de llamada a get()
realmente se active, y esperará. Probablemente sea mejor tratar su recurso dentro de una promesa que then()
o el método de devolución de llamada.
Uso estándar
var Todo = $resource(''/api/1/todo/:id'');
//create a todo
var todo1 = new Todo();
todo1.foo = ''bar'';
todo1.something = 123;
todo1.$save();
//get and update a todo
var todo2 = Todo.get({id: 123});
todo2.foo += ''!'';
todo2.$save();
//which is basically the same as...
Todo.get({id: 123}, function(todo) {
todo.foo += ''!'';
todo.$save();
});
//get a list of todos
Todo.query(function(todos) {
//do something with todos
angular.forEach(todos, function(todo) {
todo.foo += '' something'';
todo.$save();
});
});
//delete a todo
Todo.$delete({id: 123});
Del mismo modo, en el caso de lo que publicaste en el OP, podrías obtener un objeto de recurso y luego llamar a cualquiera de tus funciones personalizadas (teóricamente):
var something = src.GetTodo({id: 123});
something.foo = ''hi there'';
something.UpdateTodo();
Sin embargo, experimentaría con la implementación de OOTB antes de ir e inventar el mío. Y si descubre que no está utilizando ninguna de las funciones predeterminadas de $resource
, probablemente solo deba usar $http
por su cuenta.
Actualización: Angular 1.2 y Promesas
A partir de Angular 1.2, los recursos respaldan las promesas. Pero no cambiaron el resto del comportamiento.
Para aprovechar las promesas con $resource
, debe usar la propiedad $promise
en el valor devuelto.
Ejemplo usando promesas
var Todo = $resource(''/api/1/todo/:id'');
Todo.get({id: 123}).$promise.then(function(todo) {
// success
$scope.todos = todos;
}, function(errResponse) {
// fail
});
Todo.query().$promise.then(function(todos) {
// success
$scope.todos = todos;
}, function(errResponse) {
// fail
});
Solo tenga en cuenta que la propiedad $promise
es una propiedad con los mismos valores que devolvió anteriormente. Entonces puedes ponerte raro:
Estos son equivalentes
var todo = Todo.get({id: 123}, function() {
$scope.todo = todo;
});
Todo.get({id: 123}, function(todo) {
$scope.todo = todo;
});
Todo.get({id: 123}).$promise.then(function(todo) {
$scope.todo = todo;
});
var todo = Todo.get({id: 123});
todo.$promise.then(function() {
$scope.todo = todo;
});
Me gustaría usar $ resource para llamar a mi servicio web RESTful, (en el que todavía estoy trabajando) pero me gustaría saber si primero obtuve mi script AngularJS correcto.
El TODO todo tiene: {id, order, content, done}
:cmd
es así que puedo llamar a api/1/todo/reset
para borrar la tabla de tareas en la base de datos.
Aquí está el código con el comentario de mi comprensión:
function TodoService($resource) {
var src = $resource(''api/1/todo/:id:cmd'',
{id: "@id", cmd: "@cmd"}, //parameters default
{
ListTodos: { method: "GET", params: {} },
GetTodo: { method: "GET", params: { id: 0 } },
CreateTodo: { method: "POST", params: { content: "", order: 0, done: false } },
UpdateTodo: { method: "PATCH", params: { /*...*/ } },
DeleteTodo: { method: "DELETE", params: { id: 0 } },
ResetTodos: { method: "GET", params: { cmd: "reset" } },
});
//Usage:
//GET without ID
//it calls -> api/1/todo
src.ListTodos();
//GET with ID
//it calls -> api/1/todo/4
src.GetTodo({ id: 4 });
//POST with content, order, done
//it calls -> api/1/todo
src.CreateTodo({ content: "learn Javascript", order: 1, done: false });
//UPDATE content only
//it calls -> api/1/todo/5
src.UpdateTodo({ id: 5, content: "learn AngularJS" });
//UPDATE done only
//it calls -> api/1/todo/5
src.UpdateTodo({ id: 5, done: true });
//RESET with cmd
//it calls -> api/1/todo/reset
src.ResetTodos();
}
Una cosa particular de la que no estoy seguro es el método PATCH, no quiero actualizar todo, ¿puedo actualizar solo un campo? ¿Estoy construyendo esta pieza de código correctamente?
solo puede hacer $scope.todo = Todo.get({ id: 123 })
. .get()
y .query()
en un recurso devuelven un objeto inmediatamente y lo llenan con el resultado de la promesa más tarde (para actualizar su plantilla). No es una promesa típica por lo que necesita utilizar una devolución de llamada o la propiedad $ promise si tiene algún código especial que desea ejecutar después de la llamada. Pero no hay necesidad de asignarlo a su alcance en una devolución de llamada si solo lo está utilizando en la plantilla.