• AngularJs 学习笔记(四)服务


    模型是指$scope上保存的包含瞬时状态数据的JavaScript对象。

    服务是一个单例对象,只会被$injector实例化一次,并且是在需要的时候才会被创建,服务提供了把与特定功能相关联的方法集中在一起的接口。

    共有5种方式来创建服务:

      • factory(name,getFn):
        • name为注册的服务名,服务是单例对象在应用的生命周期内只会被调用一次,getFn可以是一个函数或者是一个包含可被注入对象的数组。
      • service(name,constructor):
        • name为要注册的服务名,constructor为构造函数,用来生成服务对象,在创建实例的时候通过new关键字来实例化服务对象(也就是创建一个对象,然后将构造函数的this绑定到这个对象上)。
      • provider(name,aProvider):
        • name参数为provideCache中注册的名字,也是服务实例的名字,name+Provider会成为服务的提供者。aProvider参数要求为一个提供者对象(包含$get函数)。所有的服务工厂都是由$provide提供的,$provide服务负责在运行时初始化这些提供者,提供者是一个具有$get()方法的对象。该方法负责在$providerCache中注册服务,所有创建服务的方法都是构建在provider方法之上,factory()方法是provider()方法的简略形式,将如传入的函数默认为服务提供者的$get函数,注入器注入服务的其实是服务提供者的$get返回的对象,也就是说$injector通过调用$get方法来创建服务实例。此外,AngularJS的config函数,可以对provider()方法返回的服务可以进行额外的配置,在config对其提供者(ServiceProvider)进行配置。
      • constant(name,value):
        • 可以将已经存在的常量注册为服务。
      • value(name,value):
        • 与constant类似,只不过前者可以注入到配置函数中来配置数据,而value不行。
      • decorator(name,decoratorFn):
        • $provide服务提供了在服务实例创建时对其进行拦截的功能,可以对服务进行扩展或者完全用另外的内容来替代name为要拦截的服务,decoratorFn为装饰器函数,在服务实例化的时候进行调用。在装饰器函数中,$delegate是进行装饰的最原始的服务(就是要被装饰的服务的引用)。

    测试代码:

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
        <script src="angular-1.5.8/angular.min.js"></script>
        <script src="angular-1.5.8/angular-route.min.js"></script>
    </head>
    <body ng-app="MyApp">
    <div ng-controller="MyController"></div>
        <script>
            var Person=function () {
                this.name='baishoujing'
            }
            var app=angular.module('MyApp',['ngRoute']);
            app.factory('UserService',['$log',function ($log) {
                $log.info('UserService is loaded!')
                return { name:'zhaoxiangjun '}
            }]);
            app.service('PersonService',Person)
            app.controller('MyController',function (UserService,PersonService) {
                alert(UserService.name)
                alert(PersonService.name)
            });
            var UserServiceDecorator=function ($delegate,$log,$injector) {
                $log.info($delegate)
                alert($delegate)
                return $delegate
            };
            app.config(function($provide){
                $provide.decorator('UserService',UserServiceDecorator)
            });
        </script>
    </body>
    </html>

     运行结果:

  • 相关阅读:
    刷题总结——table(ssoi)
    算法复习——差分约束(ssoi种树)
    刷题总结——谈笑风生(主席树+dfs序的应用)
    刷题总结——序列操作(权值线段树套树状数组)
    刷题总结——shortest(ssoi)
    算法总结——主席树(poj2104)
    刷题总结——路径(ssoi)
    刷题总结——鸭舌(ssoi)
    刷题总结——电影(ssoi)
    刷题总结——随机图(ssoi)
  • 原文地址:https://www.cnblogs.com/baishoujing/p/7245435.html
Copyright © 2020-2023  润新知