How many services are there in angularjs? Detailed analysis of services in angularjs

This article mainly talks about the detailed analysis of several services ofangularjs. There is also an introduction to the usage and differences of angularjs services. Now let’s look at this article together

Overall introduction

In a well-layered Angular application, Controller This layer should be very thin. In other words, most of the business logic and persistent data in the application should be placed in Service.

For this reason, it is necessary to understand the differences between the several Providers in AngularJS.
New services created by Provider can be used for injection. Includes:

• provider

• factory

• service

• constant

• value

Respective usage and differences

provider

is used to generate a Configurable Service consists of two parts. The variables and functions in the first part are accessible in the app.config function, and you can modify them before they are accessed elsewhere. The definition is as follows:

app.provider('myProvider', function(){ var a = ''; var func = function(){}; })

Modify a in the app.config function. This is also the reason why provider is used when there is such a simple factory:

app.config(function(myProviderProvider){ myProvider.a = 'hello world'; })

The variables in the second part and functions are returned through the $get() function and can be accessed in any controller that passes the provider.

app.provider('myProvider', function(){ this.$get = function(){ return { foo: function(){}, a: a } } })

factory

factory Returns an object. Just create an object, add properties to it, and return the object. Inject the factory in the controller to use all its properties.

app.factory('myFactory', function(){ var fac = {}; fac.a = 'hello world'; fac.foo = function(){}; return fac; })

It can be seen that the second parameter of factory is the function implementation corresponding to $get in provider.

service

service is similar to a constructor. It instantiates the object through the new keyword and adds some properties and methods directly to this. When creating the service object, this will be returned. value returned.

app.service('myService', function(){ var a = ''; this.setA = function(){}; this.getA = function(){}; this.foo = function(){}; })

The controller injected into myService can access the setA(), getA() and foo() methods bound to this in myService.

constant

constant is used to define constants. Once defined, they cannot be changed. Can be injected anywhere, but cannot be decorated by decorators.

app.constant('APP_KEY', 'a1s2d3f4')

value

Like constant, it can be used to define values. But the difference from constant is that it can be modified, decorated by decorator, and cannot be injected into config.

app.value('version', '1.0')

value is usually used to set the initial value for the application. (If you want to see more, go to the PHP Chinese websiteAngularJS Development Manualcolumn to learn)

decorator

is special, it is not a provider. It is used to decorate other providers, except constant, because as can be seen from the source code, constant is not created through the provider() method.

The following is an example of using decorator to decorate value.

app.value('version', '1.0'); app.decorator('version', function ($delegate) { return $delegate + '.1'; })

If you want to use the previous myService service, but it lacks the greet function you want. Can service be modified? The answer is no! But it can be decorated:

app.decorator('myService', function($delegate){ $delegate.greet = function(){ return "Hello, I am a new function of 'myService'"; } })

$delegate represents the actual service instance.
The ability to decorate a service is very practical, especially when we want to use a third-party service. At this time, we do not need to copy the code to our project, but only need to make some modifications.

When to use provider instead of factory?

provider is an enhanced version of factory. Use provider when a configurable factory is needed.

A brief introduction to the process of running AngularJS applications is divided into two stages, the config stage and the run stage. The config phase is where any providers are set up. This is also the stage where any directives, controllers, filters, and other things are set up. During the run phase, AngularJS compiles your DOM and starts the application.

This article ends here (if you want to see more, go to the PHP Chinese websiteAngularJS User Manualcolumn to learn). If you have any questions, you can leave a message below.

The above is the detailed content of How many services are there in angularjs? Detailed analysis of services in angularjs. For more information, please follow other related articles on the PHP Chinese website!