AngularJS $resource RESTful exemplo

Question

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.

Aqui está o código com Comentário do meu entendimento:

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?

142

javascript angularjs rest

Author: Tom, 2012-11-07

Source

2 answers

Podes fazê-lo. .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.

0

Author: William B, 2016-05-18 21:34:58

score 208 · Accepted Answer

A$resource foi feita para recuperar dados de um endpoint, manipulá-los e enviá-los de volta. Tens aí um pouco disso, mas não estás a aproveitá-lo para o que foi feito para fazer.

É 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;
});