AngularJS $resource RESTful exemplo
Eu gostaria de usar $resource para chamar o meu serviço Web Descansful, (no qual ainda estou trabalhando), mas eu gostaria de descobrir se eu tenho meu script AngularJS correto primeiro.
o todo DTO tem: {id, order, content, done}
:cmd
é para que eu possa ligar api/1/todo/reset
para limpar a tabela de itens por-fazer na base de dados.
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();
}
uma coisa em particular que eu não tenho certeza é o método de PATCH, eu não quero atualizar tudo, posso atualizar apenas um campo? Estou a construir esta peça de código correctamente?
2 answers
É bom ter métodos personalizados no seu recurso, mas você não quer perder as características legais que vem com OOTB.
EDIT : acho que não expliquei isto suficientemente bem originalmente, mas $resource
faz algumas coisas estranhas com Devoluções. Todo.get()
e Todo.query()
ambos devolvem {[18] } o objecto do recurso, e passem - no para o callback para quando o get terminar. Ele faz algumas coisas chiques com promessas nos bastidores que significa que você pode chamar $save()
antes do callback get()
realmente dispara, e ele vai esperar. Provavelmente é melhor apenas lidar com o seu recurso dentro de uma promessa then()
ou o método de callback.
Uso padrão
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});
Da mesma forma, no caso do que você postou na operação, você pode obter um recurso object and then call any of your custom functions on it (teoricamente):
var something = src.GetTodo({id: 123});
something.foo = 'hi there';
something.UpdateTodo();
Eu experimentaria a implementação da OOTB antes de inventar a minha. E se você achar que não está usando nenhuma das características padrão de $resource
, você provavelmente deveria estar usando $http
por conta própria.
Actualização: Angular 1.2 e promessas
A partir de 1.2 Angular, os recursos suportam promessas. Mas não mudaram o resto do comportamento. Para alavancar promessas com$resource
, você precisa usar a propriedade $promise
no valor devolvido.
Exemplo usando promessas
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
});
Apenas tenha em mente que a propriedade $promise
é uma propriedade com os mesmos valores que estava retornando acima. Para que possas ficar estranho.
Estes são 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;
});
.get()
e .query()
num recurso devolve um objecto imediatamente e preenche-o com o resultado da promessa mais tarde (para actualizar o seu modelo). É não uma promessa típica, e é por isso que você precisa usar uma chamada de volta ou a propriedade $promise se você tiver algum código especial que você quer executado após a chamada. Mas não há necessidade de atribuí-lo ao seu escopo em uma callback se você estiver usando apenas no modelo.