AngularJS $资源的RESTful例子 [英] AngularJS $resource RESTful example

查看:196
本文介绍了AngularJS $资源的RESTful例子的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我想用$资源打电话给我RESTful Web服务,(这我还在工作),但我想看看我有我的剧本AngularJS正确首位。

I would like to use $resource to call my RESTful web service, (which I am still working on) but I would like to find out if I got my AngularJS script correct first.

待办事项DTO有: {ID,订单,内容,做到}

:CMD 是这样我就可以叫 API / 1 / TODO /复位来清除数据库中的待办事项表

:cmd is so I can call api/1/todo/reset to clear the todo table in database.

下面是code时,我的理解评论​​:

Here is the code with comment of my understanding:

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

我不知道一个特别的事情是补丁的方法,我不希望更新的一切,我可以只更新一个字段?我是不是正确构建这块code的?

One particular thing I am not sure is the PATCH method, I don't want to update everything, can I update just one field? Am I constructing this piece of code correctly?

推荐答案

$资源是为了从端点检索数据,处理和发送回来。你得的部分的的,在那里,但你没有真正利用它它所作出的事情。

$resource was meant to retrieve data from an endpoint, manipulate it and send it back. You've got some of that in there, but you're not really leveraging it for what it was made to do.

这是罚款,对你的资源自定义方法,但你不想错过它带有开箱即用的很酷的功能。

It's fine to have custom methods on your resource, but you don't want to miss out on the cool features it comes with OOTB.

修改:我不认为我解释这口井不够的,可是$资源做一些时髦的东西与回报。 Todo.get()和Todo.query()两者的收益的资源对象,的它传递到的回调的的get完成时。它做一些花哨的东西与意味着你可以调用$保存()的get()回调实际上触发之前,它会等待幕后的承诺。这也可能是最好的只是对付你的资源承诺内部则()或回调方法。

EDIT: I don't think I explained this well enough originally, but $resource does some funky stuff with returns. Todo.get() and Todo.query() both return the resource object, and pass it into the callback for when the get completes. It does some fancy stuff with promises behind the scenes that mean you can call $save() before the get() callback actually fires, and it will wait. It's probably best just to deal with your resource inside of a promise then() or the callback method.

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

同样,在你的OP贴什么情况下,你可以得到一个资源对象,然后调用您的任何自定义函数就可以了(理论上):

Likewise, in the case of what you posted in the OP, you could get a resource object and then call any of your custom functions on it (theoretically):

var something = src.GetTodo({id: 123});
something.foo = 'hi there';
something.UpdateTodo();

我的开箱即用的实施实验前我去了,但是我发明自己。如果你发现你没有使用任何$资源的默认功能,你应该只使用HTTP $它自己。

I'd experiment with the OOTB implementation before I went and invented my own however. ANd if you find you're not using any of the default features of $resource, you should probably just be using $http on it's own.

由于角1.2,支持资源的承诺。但是,他们并没有改变行为的其余部分。

As of Angular 1.2, resources support promises. But they didn't change the rest of the behavior.

要充分利用与 $资源,您需要使用 $承诺的承诺对返回的值属性。

To leverage promises with $resource, you need to use the $promise property on the returned value.

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

只要记住了$承诺属性是基于它上面返回相同值的属性。所以,你可以得到奇怪的:

Just keep in mind that the $promise property is a property on the same values it was returning above. So you can get weird:

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

这篇关于AngularJS $资源的RESTful例子的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆