angularjs 依赖注入和服务

2016-11-29  本文已影响0人  darr250

依赖注入的是服务。
app.controller app.filter app.directive app.config 都会注入服务。
但是 angular.module:
angular.module(name, [requires], [configFn]);这里没有依赖注入。 这是模块管理。

AngularJS的服务

依赖注入

依赖注入(Dependency Injection)是一种经典的设计模式,主要是用来处理组件如何获取依赖的问题。

依赖注入可以简单的理解为:在一个容器中我们定义了很多个模块和组件化服务,当模块需要某些服务时,只需要跟容器说我需要这些服务,并且只需要提供服务的名称,容器就会自动提供这些服务的实例。调用服务的模块不需要考虑这些服务是怎么来的,这些服务会由容器通过依赖注入提供给对应的模块。

注入声明方式

AngularJs一共提供了三种注入方式
推断式的注入声明,显示注入声明,行内注入声明

注意的地方:当依赖注入的服务定义在了另一个模块中,首先需要将该模块注入到被依赖的模块中,然后才能调用该模块的服务

行内:

var app = angular.module('myApp', []);
app.controller('myCtrl', ['$scope', '$window', function ($scope, $window) {
// do something
}]);

AngularJS内置服务

Paste_Image.png

服务是一个单例对象,在每个应用中只会被实例化一次(被$injector实例化),并且是延迟加载的(需要时才会被创建)。服务提供了把与特定功能相关联的方法集中在一起的接口。提供了在应用整个生命周期保持数据的方法, 比如下面的例子,每个controller里都可以拿到和改变foo.a,保存用户登陆等信息中我们用到了:

 .controller("myCtrl", ["foo", function( foo){
     foo.sayHello();  
    console.log(foo.a);
}])
.factory("foo", function(){
  return {
    a: 1,
    sayHello: function(){
      this.a++;
      console.log("hello")
    }
  }
})

服务是一个对外提供某个特定功能,如消息服务、文件压缩等的独立模块。在AngularJS中,服务是一个单例对象或者函数。具有以下的两个特点:

代表性的内置服务

每个应用都仅有一个rootScope。其他的例如controller中的scope都是rootScope的后代scope。scope通过监听数据层的变化,实现了数据层和模型层的分离。注册在$rootScope上的值可以被子$scope覆盖。

$http服务是AngularJS和远程服务器通过ajax请求进行通信的核心服务。$http的API是基于$q服务的,它返回的是一个promise。根据返回的状态码判断执行成功的回调还是失败的回调,当状态码为200到299时执行成功回调,不在这个范围内的都执行失败回调。

$q服务是AngularJS自己封装的一种对Promise的实现,使用$q一般有两种方式。

  1. $q构造方法
    $q的构造方法接收一个函数,该函数接收resolve和reject两个参数,分别代表成功和失败后的回调函数
  2. $q的defer()方法

$location是用于解析地址栏URL的服务,可以监听和改变地址栏的URL。当改变地址栏或者点击前进和后退时可以与浏览器同步URL

上一篇 下一篇

猜你喜欢

热点阅读