1.服务(Service)介绍

Angular services are substitutable objects that are wired together using dependency injection (DI). You can use services to organize and share code across your app.

Angular服务的两大特点:

  • Lazily instantiated – Angular only instantiates a service when an application component depends on it.
  • Singletons – Each component dependent on a service gets a reference to the single instance generated by the service factory.

懒实例化-一个服务只有当程序的组件用到它的时候才进行实例化;

单例模式-每个依赖服务的组件,都是获得服务工厂生成单个实例的引用。服务是一个单例对象或函数,对外提供特定的功能。

官方提供的示例demo: Using a Service

2.内置(built-in)服务

Angular本身提供了非常多的内置服务,方便用户进行开发。和后端打交道用到的$http,URL跳转用到的$location;动画相关的$animate服务等等。

Angular内置服务

3.自定义(custom)服务的五种方式

3.1 value()

定义一个服务,服务可以是字符串,数字或者函数,对象等。它和constant不相同的地方是,它可以在其他

的地方修改,但是不能注入到config中,但是它可以被装饰器decorator修饰。

var app = angular.module('app', []);
app.value('appVersion',"v.1.0.1");

3.2 constant()

定义常量时候使用,定义的值不能进行修改。可以注入到任何需要它的组件中,但是不能被装饰器decorator修饰。

前后端分类的项目中,定义后端服务器URL地址。代码如下:

var app = angular.module('app', []);
app.constant('AppConfig', {
serverBaseUrl: 'http://192.168.1.1/api/',
});

3.3 factory()

注入的一个function,是在开发过程,自定义服务方法使用做多的一种方式。它和service的区别是,factory注入的是普通的function,而service注入的是一个构造函数constructor。因为它可以返回任何东西,所以在实际开发中使用的最多。它实际上是一个只有$get方法的provider

var app = angular.module('app', []);
app.factory('myService',function(){
var appVersion="v.1.0.1";
return appVersion;
});

3.4 service()

注入的是一个构造器,可以在控制器之间共享数据。

var app = angular.module('app' ,[]);

app.config(function ($provide) {
$provide.service('customData', function () {
this.data = 'Angular Service Here';
});
});

3.5 provider()

provider可以说是一个可以配置的factory。Angular规定provider必须返回一个$get方法。provider是value,servicefactory的封装。value,servicefactory三种方式定义的服务,底层还是调用provider方法。

var app = angular.module('app', []);
app.config(function($provide) {
$provide.provider('registration', function() {
var type;
return {
setType: function(value) {
type = value;
},
$get: function() {
return {
title: 'Service from Provider ' + type
}
}
}
})
});
//对registrationProvider进行配置
app.config(function(registrationProvider) {
registrationProvider.setType('Angular');
});

说明:在配置这里,我们注入的registrationProvider而不是在provider方法里面定义的registration服务名称,这里其实是Angular本身通过做的一件事情。config里面要注入供应商,所以写成驼峰命名格式registrationProvider,Angular会帮我们注入这个provider。

3.6 Decorator

在说明valueconstant方法时,提到了装饰器decorator。它本身不是Provider,而是来装饰其他的provider的。而上面说过provider是value,servicefactory的封装。但是constant不是,所有decorator不能装饰constant。装饰这个概念,个人理解类似C#里面的委托,可以改变已经定义服务里面的方法实现。

value装饰

var app = angular.module('app', []);
app.value('appVersion',"v.1.0.1"); app.config(function($provide){
$provide.decorator('appVersion',function($delegate){
return $delegate+"- @cmsoft"
});
});

参考

Angular Service

AngularJS中的Provider们:Service和Factory等的区别

走进AngularJs(六) 服务

http://www.html-js.com/article/1825

Angular定义服务-Learn By Doing的更多相关文章

  1. ionic准备之angular基础———服务provider 和 factory和service(9)

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  2. WCF入门教程(三)定义服务协定--属性标签

    WCF入门教程(三)定义服务协定--属性标签 属性标签,成为定义协议的主要方式.先将最简单的标签进行简单介绍,以了解他们的功能以及使用规则. 服务协定标识,标识哪些接口是服务协定,哪些操作时服务协定的 ...

  3. Language Guide (proto3) | proto3 语言指南(十二)定义服务

    Defining Services - 定义服务 如果要在RPC(Remote Procedure Call,远程过程调用)系统中使用消息类型,可以在.proto文件中定义RPC服务接口,协议缓冲区编 ...

  4. -_-#【Angular】定义服务

    AngularJS学习笔记 <!DOCTYPE html> <html ng-app="Demo"> <head> <meta chars ...

  5. Angular service定义服务

    <!DOCTYPE html><html ng-app="myApp"><head lang="en"> <meta ...

  6. angular $q服务的用法

    Promise是一种和callback有类似功能却更强大的异步处理模式,有多种实现模式方式,比如著名的Q还有JQuery的Deffered. 什么是Promise 以前了解过Ajax的都能体会到回调的 ...

  7. --@angularJS--自定义服务与后台数据交互小实例

    1.myService.html: <!DOCTYPE HTML><html ng-app="app"><head>    <title& ...

  8. angular 使用服务共享数据需要注意

    在使用服务共享数据时,需要注意一些细节,否则会出现视图不刷新,也不报错这样的问题,遇到了,总结下 如下: <div ng-controller='ctr1'> <a href={{n ...

  9. Angular——自定义服务

    基本介绍 之前我们介绍了angular内置的几种服务,这里我们介绍如何自己定义自己的服务,主要是通过三个方法:factory.service.value 基本使用 factory:可以返回对象,也可以 ...

随机推荐

  1. Akka.net路径里的user

    因为经常买双色球,嫌每次对彩票号麻烦,于是休息的时候做了个双色球兑奖的小程序,做完了发现业务还挺复杂的,于是改DDD重做设计,拆分服务,各种折腾...,不过这和本随笔没多大关系,等差不多了再总结一下, ...

  2. PHP-生成缩略图和添加水印图-学习笔记

    1.开始 在网站上传图片过程,经常用到缩略图功能.这里我自己写了一个图片处理的Image类,能生成缩略图,并且可以添加水印图. 2.如何生成缩略图 生成缩略图,关键的是如何计算缩放比率. 这里,我根据 ...

  3. [APUE]进程控制(上)

    一.进程标识 进程ID 0是调度进程,常常被称为交换进程(swapper).该进程并不执行任何磁盘上的程序--它是内核的一部分,因此也被称为系统进程.进程ID 1是init进程,在自举(bootstr ...

  4. 0-1背包问题蛮力法求解(java版本)

    sloves: package BackPack; public class Solves {  public int[] DecimaltoBinary(int n,int m)  {   int ...

  5. ABP框架 - OData 集成

    文档目录 本节内容: 简介 安装 安装Nuget包 设置模块依赖 配置你的实体 创建控制器 示例 获取实体列表 请求 响应 获取单个实体 请求 响应 获取单个实体及导航属性 请求 响应 查询 请求 响 ...

  6. Eclipse中启动tomcat报错java.lang.OutOfMemoryError: PermGen space的解决方法

    有的项目引用了太多的jar包,或者反射生成了太多的类,异或有太多的常量池,就有可能会报java.lang.OutOfMemoryError: PermGen space的错误, 我们知道可以通过jvm ...

  7. CSS 3学习——边框

    在CSS 3中可以设置边框圆角.边框阴影和边框图像,分别通过border-radius.border-image和box-shadow属性设置. 边框圆角 border-radius属性是以下4个属性 ...

  8. 【手记】注意BinaryWriter写string的小坑——会在string前加上长度前缀length-prefixed

    之前以为BinaryWriter写string会严格按构造时指定的编码(不指定则是无BOM的UTF8)写入string的二进制,如下面的代码: //将字符串"a"写入流,再拿到流的 ...

  9. Spring注解

    AccountController .java Java代码   1.        /** 2.         * 2010-1-23 3.         */ 4.        packag ...

  10. 玩转ajax

    1.什么是ajax? Ajax 是 Asynchronous JavaScript and XML(以及 DHTML 等)的缩写. 2.ajax需要什么基础? HTML 用于建立 Web 表单并确定应 ...