Providers in Angular

Angular provider is essential part of AngularJS.

You can provide services to your app by using the providers array in an NgModule. Consider the default app generated by the CLI. In order to add a user service to it, you can generate one by entering the following command in the terminal window:

ng generate service User

This creates a service called UserService. You now need to make the service available in your app’s injector. Update app.module.ts by importing it with your other import statements at the top of the file and adding it to the providers array:

 

src/app/app.module.ts

import { NgModule } from ‘@angular/core’;

import { BrowserModule } from ‘@angular/platform-browser’;

 

import { AppComponent } from ‘./app.component’;

import { UserService } from ‘./user.service’;

 

@NgModule({

imports:  [ BrowserModule ],

providers:[ UserService ],

declarations: [ AppComponent ],

bootstrap:[ AppComponent ]

})

export class AppModule { }

Provider scope

When you add a service provider to the providers array of the root module, it’s available throughout the app. Additionally, when you import a module that has providers, those providers are also available to all the classes in the app as long they have the lookup token. For example, if you import the HttpClientModule into your AppModule, its providers are then available to the entire app and you can make HTTP requests from anywhere in your app.

IT Professionals, Web Developers, Web Programmers, IT students can Apply for the certification course to move ahead in their careers.

• Practice Test for Angular4
• Govt Certification in Angular 4
• Blog posts on Angular 4 and Web Development

Back to Angular 4 Tutorial Main Page