`
hudeyong926
  • 浏览: 2031676 次
  • 来自: 武汉
社区版块
存档分类
最新评论

AngularJS Provider,Service,Factory

 
阅读更多

provider是干啥的?

provider可以为应用提供通用的服务,形式可以是常量,也可以是对象。

比如我们在controller里常用的$http就是AngularJS框架提供的provider

myApp.controller(‘MainController', function($scope, $http) {
    $http.get(…)
}

 在上面的代码里,就可以直接使用$http包好的各种功能了

provider

那我们自己想定制一个provider,怎么写呢

//定义:
$provide.provider('age', {
    start: 10,
    $get: function() {
      return this.start + 2;
    }
});
//或
$provide.provider('age', function($filterProvider){
    this.start = 10;
    this.$get = function() {
      return this.start + 2;
    };
});

//调用:
app.controller('MainCtrl', function($scope, age) {
  $scope.age = age; //12
});

 provider的基本原则就是通过实现$get方法来在应用中注入单例,使用的时候拿到的age就是$get执行后的结果。 上面例子中的两种定义方法都可以

factory

$provide.provider('myDate', {
    $get: function() {
      return new Date();
    }
});
//可以写成
$provide.factory('myDate', function(){
    return new Date();
});

//调用:
app.controller('MainCtrl', function($scope, myDate) {
  $scope.myDate = myDate; //current date
});

 直接第二个参数就是$get要对应的函数实现,代码简单了很多有没有?!

service

这时候我又来劲儿了,我不仅就想定义个$get,里面我还就返回个new出来的已有js类,三哥service闪亮登场

$provide.provider('myDate', {
    $get: function() {
      return new Date();
    }
});
//可以写成
$provide.factory('myDate', function(){
    return new Date();
});
//可以写成
$provide.service('myDate', Date);

 对于这种需求,代码更简洁了是不是

最后再总结一下provider哥儿几个的优点~

1. 为应用提供通用的服务,形式可以是常量或对象

2. 便于模块化

3. 便于单元测试

 

分享到:
评论

相关推荐

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

    本文将详细讲解AngularJS中的Provider、Factory和服务,并通过实例代码进行对比,以便更好地理解它们的工作原理。 1. **Provider** Provider是最强大的服务创建方式,因为它允许我们在应用配置阶段进行配置。`$...

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

    AngularJS提供了三种不同的方式来创建和注册服务:Factory、Service和Provider。理解它们之间的区别和使用场景是提升AngularJS开发技能的关键。 1. Factory Factory是最常用的服务创建方式。在Factory中,你可以...

    AngularJS服务service用法总结

    m1.controller('firstController', ['$scope', 'providerService01', 'factoryService01', function($scope, providerService01, factoryService01) { // 使用providerService01服务 console.log(providerService...

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

    在AngularJS中,服务(Service)、工厂(Factory)和提供者(Provider)是三种不同的方式来创建可注入的对象,它们都是依赖注入系统的一部分,用于在应用程序的不同组件之间共享数据和服务。下面将详细介绍这三者的...

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

    Angular中的自定义服务Service、Provider以及Factory详解 在Angular中的自定义服务中,有三种方式可以实现服务的复用性,即Service、Provider和Factory。这些方法可以提高Angular代码的复用性和可维护性。 Factory...

    angularJS——三种自定义service方法

    本篇将详细讲解AngularJS中三种自定义服务的方法:factory、service和provider,以及如何通过它们实现一个数的立方功能。 1. **Factory方法**: Factory是最常用的服务创建方式,它允许我们返回一个值,这个值可以...

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

    本文将深入探讨三种创建自定义服务的方式:Factory、Service和Provider。 1. **Factory(工厂)** Factory是AngularJS中最常用的服务创建方式之一。它通过函数返回一个对象,该对象包含服务的属性和方法。在...

    angularJs demo 各种基本用法

    自定义服务可以通过`factory`、`service`、`provider`等方式创建。 **指令(Directive)**: 指令是AngularJS的一个创新特性,它们扩展了HTML,让DOM元素具备更丰富的行为。常见的内置指令有`ngRepeat`(用于迭代...

    AngularJS API常用方法示例

    `service`基于构造函数,`factory`返回一个对象,而`provider`在配置阶段提供配置,运行阶段返回服务。 以上仅是AngularJS API的一部分,实际开发中还有许多其他功能,如`directives`(自定义指令)、`filters`...

    angularjs前端框架

    - **服务创建**:使用`.service()`、`.factory()`或`.provider()`来定义服务。 - **服务注入**:在控制器或其它服务中通过构造函数参数注入服务。 ##### 3. 模板 AngularJS使用HTML作为模板语言,通过指令和表达式...

    AngularJS 高级程序设计编程学习代码

    通过`.service()`, `.factory()`, 或 `.provider()`方法可以创建自定义服务。 **6. 视图和路由** AngularJS的`ngView`指令结合`$routeProvider`服务,实现了视图的动态加载和路由管理。通过定义路由规则,我们可以...

    AngularJS的-查询列表

    7. **服务(Service)**: AngularJS的服务可以用来封装共享的数据和功能,如数据获取、存储和查询。你可以创建一个`QueryService`来处理从服务器获取数据或执行复杂的查询逻辑。 8. **模块(Module)**: 模块是...

    AngularJS 学习资料

    - **工厂(Factory)**:工厂是一种常用的模式,用于创建对象实例,通常包含复杂的逻辑。 - **服务(Service)**:服务是封装特定任务或一组任务的对象,可以被多个控制器共享。 - **提供商(Provider)**:提供商允许配置...

    angularjs高级程序设计 代码

    服务可以通过`factory`、`service`、`provider`等方式定义。 4. **指令(Directives)**:指令允许我们扩展HTML,创建自定义的DOM元素或属性。如`ngRepeat`用于数据遍历,`ngIf`控制元素的显示和隐藏。 5. **数据...

    解决angularjs service中依赖注入$scope报错的问题

    AngularJS允许开发者在服务(Service)、控制器(Controller)和工厂(Factory)中注入依赖,例如内置的服务、自定义的服务或组件。在某些情况下,开发者可能会尝试将$scope对象注入到服务中,这将导致依赖注入机制发生...

    《angularJs深度剖析与最佳实践》源码

    源码中会有各种服务的实现,如`factory`、`service`、`provider`等不同创建方式的示例。 5. **模块**:AngularJS的模块(`angular.module`)用于组织应用,它们可以包含控制器、服务、指令等。源码将展示如何创建和...

    AngularJS 中文API参考手册.zip_API_angularjs_angularjs api

    我们可以通过`angular.service()`, `angular.factory()`, 或 `angular.provider()`来创建自定义服务。 **四、指令(Directives)** 指令是AngularJS中的一个重要特性,它们扩展了HTML,使其能够表达应用程序的行为...

    Angularjs 开发实例

    自定义服务可以通过`factory`、`service`、`provider`等方式创建。 4. **指令(Directives)**:指令扩展了HTML,让HTML能够执行特定的行为。例如,`ng-repeat`用于循环遍历数组并渲染多个元素,`ng-if`根据表达式...

Global site tag (gtag.js) - Google Analytics