Source Code Analysis of Small Differences Between Providers in AngularJS

AngularJS Provider

Angular has the following methods for creating providers:

  • provider()
  • service()
  • factory()

Provider Usage

angular.module("app", [])
.provider("HelloAngular", function() {
    return {
        $get: function() {
            var name = "Xiaoming";
            function getName() {
                return name;
            }
            return {
                getName: getName
            }
        }
    }
})
.controller('MyCtrl', ['$scope', 'HelloAngular',
    function($scope, helloAngular) {
        $scope.gameName = helloAngular.getName();
    }
]);

Service Usage

angular.module("app", [])
.service("HelloAngular", function() {
    this.name = "Xiaoming";
    this.getName=function(){
        return this.name;
    }
})
.controller('MyCtrl', ['$scope', 'HelloAngular',
    function($scope, helloAngular) {
        $scope.gameName = helloAngular.getName();
    }
]);

Factory Usage

angular.module("app", [])
.factory("HelloAngular", function() {
    var name = "Xiaoming";
    function getName(){
        return name;
    }
    return {
    	getName:getName
    };
})
.controller('MyCtrl', ['$scope', 'HelloAngular',
    function($scope, helloAngular) {
        $scope.gameName = helloAngular.getName();
    }
]);

Implementation methods each have differences, but usage is exactly the same

AngularJS Source Code Analysis

function provider(name, provider_) {
    if (isFunction(provider_)) {
        provider_ = providerInjector.instantiate(provider_);
    }
    if (!provider_.$get) {
        throw Error('Provider ' + name + ' must define $get factory method.');
    }
    return providerCache[name + providerSuffix] = provider_;
}

//Finally returns a provider
function factory(name, factoryFn) { return provider(name, { $get: factoryFn }); }

//First becomes factory, but factory finally returns a provider
function service(name, constructor) {
    return factory(name, ['$injector', function($injector) {
        return $injector.instantiate(constructor);
    }]);
}

All revolve around provider making small modifications, achieving various provider methods.

Article Link:

https://alili.tech/en/archive/41effd04/

# Latest Articles