[angularjs] AngularJS: Service vs provider vs factory

Factory

You give AngularJS a function, AngularJS will cache and inject the return value when the factory is requested.

Example:

app.factory('factory', function() {
    var name = '';
    // Return value **is** the object that will be injected
    return {
        name: name;
    }
})

Usage:

app.controller('ctrl', function($scope, factory) {
     $scope.name = factory.name;
});

Service

You give AngularJS a function, AngularJS will call new to instantiate it. It is the instance that AngularJS creates that will be cached and injected when the service is requested. Since new was used to instantiate the service, the keyword this is valid and refers to the instance.

Example:

app.service('service', function() {
     var name = '';
     this.setName = function(newName) {
         name = newName;
     }
     this.getName = function() {
         return name;
     }
});

Usage:

app.controller('ctrl', function($scope, service) {
   $scope.name = service.getName();
});

Provider

You give AngularJS a function, and AngularJS will call its $get function. It is the return value from the $get function that will be cached and injected when the service is requested.

Providers allow you to configure the provider before AngularJS calls the $get method to get the injectible.

Example:

app.provider('provider', function() {
     var name = '';
     this.setName = function(newName) {
          name = newName;
     }
     this.$get = function() {
         return {
            name: name
         }
     }
})

Usage (as an injectable in a controller)

app.controller('ctrl', function($scope, provider) {
    $scope.name = provider.name;
});

Usage (configuring the provider before $get is called to create the injectable)

app.config(function(providerProvider) {
    providerProvider.setName('John');
});

Examples related to angularjs

AngularJs directive not updating another directive's scope ERROR in Cannot find module 'node-sass' CORS: credentials mode is 'include' CORS error :Request header field Authorization is not allowed by Access-Control-Allow-Headers in preflight response WebSocket connection failed: Error during WebSocket handshake: Unexpected response code: 400 Print Html template in Angular 2 (ng-print in Angular 2) $http.get(...).success is not a function Angular 1.6.0: "Possibly unhandled rejection" error Find object by its property in array of objects with AngularJS way Error: Cannot invoke an expression whose type lacks a call signature

Examples related to dependency-injection

Are all Spring Framework Java Configuration injection examples buggy? Passing data into "router-outlet" child components ASP.NET Core Dependency Injection error: Unable to resolve service for type while attempting to activate Error when trying to inject a service into an angular component "EXCEPTION: Can't resolve all parameters for component", why? org.springframework.beans.factory.UnsatisfiedDependencyException: Error creating bean with name 'demoRestController' How to inject window into a service? How to get bean using application context in spring boot Resolving instances with ASP.NET Core DI from within ConfigureServices How to inject a Map using the @Value Spring Annotation? WELD-001408: Unsatisfied dependencies for type Customer with qualifiers @Default

Examples related to angularjs-service

Angularjs: Error: [ng:areq] Argument 'HomeController' is not a function, got undefined AngularJS Error: $injector:unpr Unknown Provider AngularJS : Factory and Service? how to call service method from ng-change of select in angularjs? AngularJS : When to use service instead of factory How to wait till the response comes from the $http request, in angularjs? How to access the services from RESTful API in my angularjs page? How do I configure different environments in Angular.js? AngularJS : The correct way of binding to a service properties AngularJS: Service vs provider vs factory

Examples related to angularjs-factory

AngularJS : Factory and Service? how to call service method from ng-change of select in angularjs? AngularJS : When to use service instead of factory AngularJS: Service vs provider vs factory

Examples related to angularjs-provider

AngularJS: Service vs provider vs factory