在学习笔记-AngularJs（六）提及了事件处理器和过滤器以及它们的例子，而我们知道之前我是使用$http服务去获得我们需要的json数据，但是$http是比较底层的用法，有时候我们想把获取json数据包装成一个服务，然后每个控制器只要直接依赖我们自己写的服务，就可以去获取需要的数据，那么就需要自定义服务，现在我们需要学习一下怎么定义自己的服务，于是我们在js中建了services.js，一不小心插入个链接，http://t.cn/RUbL4rP，忽略，代码如下：
var phoneService = angular.module('phoneService', ['ngResource']);
phoneService.factory("People",function($resource){ //工程函数，自定义的服务尽量不要使用$,避免跟自带服务混淆
return $resource('json/:phoneId.json', {}, {
query: {method:'GET', params:{phoneId:'phone'}, isArray:true}
});
})
//工厂创建一个资源对象,让你与RESTful服务器端数据源交互。
这里建立模块phoneService，至于为啥要怎么建，之前有讲过了，这里需要注意的是，依赖了ngResource模块，而且必须在index.html引入angular-resource.js文件，那么就可以使用$resource服务了。建立服务，可以使用factory、service，这里使用的是factory。在这里就不得不讲一下这个$resource服务了，使用方法：
$resource(url, [paramDefaults], [actions], options);
url，指得是RESTful服务器端的地址，有这样的一些形式：
$resource('http://example.com/resource.json') //这里指向的是resource.json
$resource('http://example.com/:id.json') //通过传一个id参数过来，去获取对应的json
$resource('http://example.com/resource/:resource_id.:format')//通过传一个resource_id和format参数过来，去获取对应的格式的数据模型
paramDefaults，指得是默认参数，是一个对象，比如说：{resource_id:'1', salutation:'Hello'}，那么其实整个默认url就是'http://example.com/resource/resource_id/1?salutation=hello'，当参数{someParam: '@someProp'}是以@为前缀,那么这个参数的值将从相应的属性中提取data对象(调用一个操作方法时提供)。例如,如果defaultParam对象是{ someParam:@someProp }然后someParam将data.someProp的value。对于这个带@前缀的值，不大清楚是怎么回事，望知道的人告知一下！
action，可以自定义获取资源的行为，其语法如下：
{action1: {method:?, params:?, isArray:?, headers:?, ...},
action2: {method:?, params:?, isArray:?, headers:?, ...},
...}
其对应的参数，还有url（资源路径的重写）、timeout（请求超时）、responseType（请求数据类型）、function（data）{...}的Response函数，等等（更多属性可去官方文档看）！
比如说我们重新自定义query请求资源的行为：query: {method:'GET', params:{phoneId:'phone'}, isArray:true}，那么调用该方法，就能获得phone.josn的数据。
也有这些默认的行为（其属性是与自定义资源行为的action是一样的）：
{ 'get': {method:'GET'},
'save': {method:'POST'},
'query': {method:'GET', isArray:true},
'remove': {method:'DELETE'},
'delete': {method:'DELETE'} };
假如现在有怎么一个需求，需要我们在控制器文件中检索出phone.json中userId=123的一条数据，可以这样写：
//services.js（自定义服务文件）
phoneService.factory("People",function($resource){
return $resource('/user/:userId', {userId:'@id'});
})
//controller.js（控制器文件）
var user = People.get({userId:123}, function() {
user.abc = true;
user.$save();
});这里是这样的，获得userId=123的某个对象，然后在其回调函数将其user.abc进行修改，然后使用$save保存，然后再返回新的记录，赋给user，user是我们得到的资源对象实例，那么操作保存,删除,删除可用方法$+对应资源行为（eg:$save()）方法。这样就可以轻松地支持CRUD操作(创建、读取、更新、删除)在服务器端数据！想更好理解这种形式的curd，可以看一下这个官方的例子：
// Define CreditCard class
var CreditCard = $resource('/user/:userId/card/:cardId',
{userId:, cardId:'@id'}, {
charge: {method:'POST', params:{charge:true}}
}); // We can retrieve a collection from the server
var cards = CreditCard.query(function() {
// GET: /user/123/card
// server returns: [ {id:456, number:'1234', name:'Smith'} ]; var card = cards[];
// each item is an instance of CreditCard
expect(card instanceof CreditCard).toEqual(true);
card.name = "J. Smith";
// non GET methods are mapped onto the instances
card.$save();
// POST: /user/123/card/456 {id:456, number:'1234', name:'J. Smith'}
// server returns: {id:456, number:'1234', name: 'J. Smith'}; // our custom method is mapped as well.
card.$charge({amount:9.99});
// POST: /user/123/card/456?amount=9.99&charge=true {id:456, number:'1234', name:'J. Smith'}
}); // we can create an instance as well
var newCard = new CreditCard({number:''});
newCard.name = "Mike Smith";
newCard.$save();
// POST: /user/123/card {number:'0123', name:'Mike Smith'}
// server returns: {id:789, number:'0123', name: 'Mike Smith'};
expect(newCard.id).toEqual();
好了，来看一下controller.js文件：
var phoneController = angular.module('phoneController', []);
phoneController.controller("phone-list-controller",['$scope','People',function($scope,People){
$scope.phones = People.query(); //重写的资源行为
$scope.order = 'name';
}]);
phoneController.controller("phone-detail-controller",["$scope",'$routeParams',"People","$location",function($scope,$routeParams,People,$location){
if($routeParams.phoneId){
//使用默认资源行为
$scope.people = People.get({phoneId: $routeParams.phoneId}, function(data) {
$scope.main_image = data.images[0];
});
}else{
$location.path("/phones");
}
$scope.setImage=function(url){
$scope.main_image = url;
}
/*$location使用*/
console.log($location.absUrl()); //"http://example.com/#/some/path?foo=bar&baz=xoxo" => 完整url
console.log($location.url()); // "/some/path?foo=bar&baz=xoxo" => url的search部分
console.log($location.protocol()); // "http" =>协议
console.log($location.host()); // "example.com" => 主机
console.log($location.port()); // "80" =>端口号
//console.log($location.path([path])); // "/some/path" => 跳转至指定路由
console.log($location.search()); //{foo: 'bar', baz: 'xoxo'} => 以对象形式展现，还可以$location.search("foo","yahoo");进行修改
console.log($location.hash()); // given url http://example.com/#/some/path?foo=bar&baz=xoxo#hashValue $location.hash() == "hashValue"
//更详细的介绍可以去看官方文档
}]);
上面有着$loaciton服务的一些补充！那么学习的项目就这样搞定了，但是就只是入门而已，接下来需要好好阅读angularJs的官方文档，真正想搞懂，还是得去看文档！虽然是英文渣渣，但是确实必经之路！加油！源码下载：https://github.com/xiaobin5201314/AngularJS-Learning.git