`
xiaoluode
  • 浏览: 13696 次
  • 来自: 深圳
社区版块
存档分类
最新评论

factory, service与provider的区别

 
阅读更多

Angular为我们提供了三种创建服务的方式:

1、Factory

2、Service

3、Provider

一、当使用 factory 来创建服务的时候,相当于新创建了一个对象,然后在这个对象上新添属性,最后返回这个对象。当把这个服务注入控制器的时候,控制器就可以访问在那个对象上的属性了。

 

app.factory('MyFactory', function () {
        var _artist = '',
            service = {};

        service.getArtist = function () {
            return _artist;
        };

        return service;
    })
    .controller('myFactoryCtrl', [
        '$scope', 'MyFactory',
        function ( $scope, MyFactory ) {
            $scope.artist = MyFactory.getArtist();
        }]);

 二、当使用 service 创建服务的时候,相当于使用 new 关键词进行了实例化。因此,你只需要在 this 上添加属性和方法,然后,服务就会自动的返回 this 。当把这个服务注入控制器的时候,控制器就可以访问在那个对象上的属性了。

 

 

app.service('MyService', function () {
        var _artist = '';
    
        this.getArtist = function () {
            return _artist;
        };
    })
    .controller('myServiceCtrl', [
        '$scope', 'MyService',
        function ( $scope, MyService ) {
            $scope.artist = MyService.getArtist();
        }]);

 三、 provider 是唯一一种可以创建用来注入到 config() 函数的服务的方式。想在你的服务启动之前,进行一些模块化的配置的话,就使用 provider 。

 

app.provider('MyProvider', function () {

        // 只有直接添加在this上的属性才能被config函数访问
        this._artist = '';
        this.thingFromConfig = '';

        // 只有$get函数返回的属性才能被控制器访问
        this.$get = function () {
            var that = this;

            return {
                getArtist: function () {
                    return that._artist;
                },
                thingFromConfig: that.thingFromConfig
            };
        };
    })
    .config(['MyProvider', function ( MyProvider ) {
        MyProvider.thingFormConfig = 'this is set in config()';
    }])
    .controller('myProviderCtrl', [
        '$scope', 'MyProvider',
        function ( $scope, MyProvider ) {
            $scope.artist = MyProvider.getArtist();
        }]);

 

分享到:
评论

相关推荐

    AngularJS 之 Factory vs Service vs Provider - 技术翻译 - 开源中国社区1

    AngularJS 之 Factory vs Service vs Provider ­ 技术翻译 ­ 开源中国社区143人收藏此文章, 我要收藏参与翻译(4人

    详解Angular中的自定义服务Service、Provider以及Factory

    本篇文章主要介绍了详解Angular中的自定义服务Service、Provider以及Factory,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

    AngularJS之自定义服务详解(factory、service、provider)

    Factory Service Provider 2、大家应该知道,AngularJS是后台人员在工作之余发明的,他主要应用了后台早就存在的分层思想。所以我们得了解下分层的作用,如果你是前端人员不了解什么是分层,那么你最好问问你后台...

    AngularJS中serivce,factory,provider的区别 - I have a dream - 开源中国社区2

    摘要翻译,原文链接:http://www.ng-newsletter.com/advent2013/#!目录[-]一、service引导二、service一、s

    angularJS Provider、factory、service详解及实例代码

    你把 service 传进 controller 之后,在 controller 里这个对象里的属性就可以通过 factory 使用了。 app.controller('myFactoryCtrl', function($scope, myFactory){ $scope.artist = myFactory.getArtis(); }); ...

    create-components-cli:快速创建组件

    [TOC] 快速创建组件 用于快速生成cloud项目的directive,service组件及其路径。 生成完毕自动弹出资源管理器,方便引入。 依赖 建议使用其他第三方shell工具,使用了rm,start命令,可能不支持...# provider $ npm run n

    angularJs Demo

    09-$provide.factory、service方法.html 10-多个控制器数据共享.html 11-过滤器.html 12-购物车练习-过滤器.html 13-购物车练习-路由器.html 14-表单验证.html 15-controler之间的通信.html

    毕设数据处理源代码(python).py

    Materna is a full service provider in the premium segment and has been successfully implementing ITC projects for their customers for more than 35 years. Thier client list reads like the “Who’s Who...

    详解Angular中$cacheFactory缓存的使用

    其中provider是最基础的,其他服务都是基于这个写的,具体区别这里就不展开了,大家可以看看源码;服务是各个controller之间通话的重要形式,在实际项目中会用的很多,下面是代码: angular.module('yourApp')....

    EJB HelloWorld

    props.setProperty("java.naming.factory.initial", "org.jnp.interfaces.NamingContextFactory"); props.setProperty("java.naming.provider.url", "localhost:1099"); InitialContext ctx = new ...

    angular-modular:具有模块化架构和基本 UI 路由器设置的 AngularJS 基础

    角度模块化 使用 UI Router 启动具有模块化和可扩展架构的 AngularJS 项目 入门 要开始使用该项目,请clone或fork它。 它使用节点包管理器 (NPM) 来管理全局包,使用 Bower 来管理扩展。... service/

    javaee API

    javax.jms The Java Message Service (JMS) API provides a common way for Java programs to create, send, receive and read an enterprise messaging system's messages. javax.jws javax.jws.soap javax.mail...

    generator-angular-brunch:AngularJS,早午餐,Jade模板等等。

    控制器yo angular-brunch:controller 服务yo angular-brunch:service 工厂yo angular-brunch:factory 提供者yo angular-brunch:provider已知的问题 :此库依赖于节点0.10 ,如果您有更高版本,则在运行早午餐w时会...

    Angularjs 自定义服务的三种方式(推荐)

    angularjs 中可通过三种($provider,$factory,$service)方式自定义服务。这篇文章主要介绍了Angularjs 自定义服务的三种方式,非常不错,需要的朋友可以参考下

    spring security 参考手册中文版

    13.5与其他基于过滤器的框架一起使用 118 13.6高级命名空间配置 118 14.核心安全筛选器 119 14.1 FilterSecurityInterceptor 119 14.2 ExceptionTranslationFilter 121 14.2.1 AuthenticationEntryPoint 122 14.2.2 ...

    SAP BW经典教材,word版本,值得收藏

    Mapping the Corporate Information Factory to SAP BW components 70 The Operational Data Store 73 The Data Warehouse Layer 73 The InfoMart Layer 74 The Architectural Roots of SAP BW 75 SAP Web ...

    wireless:轻量级的声明式依赖提供程序

    # factory: return a new value every time on ( :foo ) do [ :foo , count += 1 ] end # singleton: return the cached value once ( :bar ) do [ :bar , count += 1 ] end # depend on other ...

Global site tag (gtag.js) - Google Analytics