$resource Data Interaction plug-in

Learning Essentials:
1. $resource 2. $resource 3. Angular resources (see)
4. Angularjs custom directives post-lecture

1．$resourceBrief introduction
$resource：
$resourceThe core value of the service is: providing developers withRESTfulStyleWebServicesThe more interactive
A good user experience, it encapsulates a lower-level$http, so there is no need for front-end developers to write large numbers of asynchronous
The request code.
RESTfulArchitecture:
（1) Each oneUriRepresents a resource;
（2) between the client and the server, passing on some kind of presentation layer of this resource;
（3) Client through FourHTTPVerbs, operate on server-side resources and implement"Presentation Layer State Transformation"。
RESTfulArchitecture Learn MORE:
Http://www.ruanyifeng.com/blog/2011/09/restful.html
2．$resourceThe use
1.IntroducedAngular-resource.min.js
2.Load when defining a moduleNgresource
var app = Angular.module (' app ', ["Ngresource"]);
3.Write code
http://www.thinksaas.cn/group/topic/348581/
http://docs.angularjs.cn/api/ngResource/service/$resource
$resource (URL, [paramdefaults], [Actions], options);
Supported methods:
{
' Get ': {method: ' Get '},
' Save ': {method: ' POST '},
' Query ': {method: ' GET ', isarray:true},
' Remove ': {method: ' DELETE '},
' Delete ': {method: ' delete '}
};
var User = $resource ('/user/:userid ', {userId: ' @id '});
var user = User.get ({userid:123}, function () {
USER.ABC = true;
User. $save ();
});
Back-end support for cross-domain requestsPHPFor example:
Header (' access-control-allow-origin: * ');
3. When you can use Angular resources (see below)
You can use Angular resources only when the server is working in a RESTful way. For credit
Card scene, it requires:
1. A GET request to/user/123/card returns a list of 123 credit cards for the user.
2. A GET request to/USER/123/CARD/15 returns a credit card with ID 15 for user 123.
3. A POST request to/user/123/card, with credit card information in the post data, will
Create a new credit card for user 123 's ID.
4. A POST request to/USER/123/CARD/15, with the credit card information in the post data, will
Update the credit card information for user 123 with ID 15.
5. A delete request to/USER/123/CARD/15, which will delete the user 123 with the ID 15 of the letter
Use card information.
In learning how to useNgresourceMethod before creating a resource, let's take a look at using the basic$http
Services to create something like that need to do something. For our credit card resources, in addition to being able to
enough to make it"Change"(charge) operation, we are also able toGet(GET),Query(check
Consultation) andSave(save) credit card.
Myappmodule.factory (' CreditCard ', [' http ', function ($http) {
var baseUrl = '/user/123/card ';
return {
Get:function (cardId) {
Return $http. Get (BaseUrl + '/' + cardId);
},
Save:function (Card) {
var url = card.id? BASEURL + '/' + card.id:baseUrl;
Return $http. Post (URL, card);
},
Query:function () {
Return $http. Get (BASEURL);
},
Charge:function (Card) {
Return $http. Post (BaseUrl + '/' + card.id, card, {params: {charge:true}});
}
};
}]);
In addition to this approach, you can simply create a Angular service that will be depicted in the following ways
Resources provided by the application:
Myappmodule.factory (' CreditCard ', [' $resource ', function ($resource) {
Return $resource ('/usr/:userid/card/:cardid ',
{userid:123, cardId: ' @id '},
{charge: {method: ' POST ', params: {charge:true}, isarray:false});
}]);

< Span style= "FONT-SIZE:12PT;" > 650) this.width=650; "src=" http://s3.51cto.com/wyfs02/M02/75/85/wKiom1Y7GPnyvWDlAAGfZLm3Ar4979.jpg "title=" aa.png "alt=" wkiom1y7gpnyvwdlaagfzlm3ar4979.jpg "/>

This article is from the "Wennuanyiran" blog, make sure to keep this source http://dingzhaoqiang.blog.51cto.com/5601059/1710088

$resource Data Interaction plug-in