欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

AngularJs Creating Services详解及示例代码

程序员文章站 2022-06-20 11:46:31
虽然angular提供许多有用的service,在一些特别的应用中,我们会发现编写自定义service是很有用的。如果我们想做这件事,我们首先要在module中注册一个se...

虽然angular提供许多有用的service,在一些特别的应用中,我们会发现编写自定义service是很有用的。如果我们想做这件事,我们首先要在module中注册一个service工厂方法,可以通过module.factory api(http://docs.angularjs.org/api/angular.module)或者在module配置方法中直接通过$provide api(http://docs.angularjs.org/api/auto.$provide)。

  所有angular service都参与到di()中,既可以通过angular di系统(injector)中使用名称(id)注册自己,也可以通过在其他工厂方法中声明对已存在的service的依赖。

一、registering services

  为了注册一个service,我们必须拥有一个module,并且使这个server成为这个module的一部分。然后,我们可以通过module api或者在module配置函数中注册service。下面的伪代码将展示这两种注册方式。

  使用angular.module api:

var mymodule = angular.module(‘mymodule',[]);
mymodule.factory(‘serviceid',function() {
  var someservice;
  //工厂方法体,构建someservice
  return someservice;

});

  使用$provide service:

angular.module(‘mymodule',[],function($provide) {
  $provide.factory(‘serviceid',function() {
    var someservice;
    //工厂方法体,构建someservice
    return someservice;
  });
}); 

  注意,我们无须注册一个服务实例,相反地,工厂方法会在它被调用的时候被实例化。

二、dependencies

  service不仅仅可以被依赖,更可以拥有自己的依赖。可以在工厂方法的参数中指定依赖。阅读()更多关于angular中的di、数组标记的用途和$inject属性,让di声明更加简洁。(read more about the di in angular and the use of array notation and $inject property to make di annotation minification-proof……)

  下面是一个非常简单的service例子。这个服务依赖$window service(通过工厂方法参数传递),而且只有一个方法。这个service简单地储存所有通知,在第三个之后,这个service会通过window.alert显示所有通知。

<!doctype html>
<html lang="zh-cn" ng-app="mainapp">
<head>
 <meta charset="utf-8">
 <title>services</title>
</head>
<body>
<div ng-controller="mycontroller">
 <input type="text" ng-model="msg"/>
 <button ng-click="savemsg()">save msg</button>
 <ul>
  <li ng-repeat="msg in msgs">{{msg}}</li>
 </ul>
</div>
<script src="../angular-1.0.1.js" type="text/javascript"></script>
<script type="text/javascript">
 var app = angular.module("mainapp",[],function($provide) {
  $provide.factory("notify",["$window","$timeout",function(win,timeout) {
   var msgs = [];
   return function(msg) {
    msgs.push(msg);
    if(msgs.length==3) {
     timeout(function() {
      win.alert(msgs.join("\n"));
      msgs = [];
     },10);
    }
   }
  }])
 });
 app.controller("mycontroller",function($scope,notify) {
  $scope.msgs = [];
  $scope.savemsg = function() {
   this.msgs.push(this.msg);
   notify(this.msg);
   this.msg = "";
  };
 });
</script>
</body>
</html>

三、instantiating angular services

  所有在angular中的service都是延迟实例化的(lazily)。这意味着service仅仅在其他依赖它的已实例化的service或者应用组件中被依赖时,才会创建。换句话说,angular直到服务被直接或者间接请求时候,才会实例化service。

四、services as singletons

  最后,我们必须意识到所有angular service都是一个单例应用。这意味着每一个injector中有且只有一个给定service的实例。由于angular是极其讨厌破坏global state的,所以创建多个injector,使每一个都有指定service的实例是可行的,除了在测试中有强烈的需求外,一般很少有这样的需要。

 以上就是关于angular services 的资料整理,后续继续补充相关资料,谢谢大家对本站的支持!