{"id":71726,"date":"2020-01-10T16:23:57","date_gmt":"2020-01-10T10:53:57","guid":{"rendered":"https:\/\/www.vskills.in\/certification\/tutorial\/?p=71726"},"modified":"2024-04-12T14:22:40","modified_gmt":"2024-04-12T08:52:40","slug":"providers-in-angular-2","status":"publish","type":"page","link":"https:\/\/www.vskills.in\/certification\/tutorial\/providers-in-angular-2\/","title":{"rendered":"Providers in Angular"},"content":{"rendered":"\n

Go back to Tutorial<\/a><\/p>\n\n\n

A provider is an instruction to the DI system on how to obtain a value for a dependency. Most of the time, these dependencies are services that you create and provide.<\/p>\n

Providing a service<\/strong><\/p>\n

If you already have a CLI generated app, create a service using the following CLI command in the root project directory. Replace User with the name of your service.<\/p>\n

ng generate service User<\/p>\n

This command creates the following UserService skeleton:<\/p>\n

src\/app\/user.service.0.ts<\/u><\/p>\n

import { Injectable } from ‘@angular\/core’;<\/p>\n

@Injectable({<\/p>\n

providedIn: ‘root’,<\/p>\n

})<\/p>\n

export class UserService {<\/p>\n

}<\/p>\n

You can now inject UserService anywhere in your application.<\/p>\n

The service itself is a class that the CLI generated and that’s decorated with @Injectable. By default, this decorator is configured with a providedIn property, which creates a provider for the service. In this case, providedIn: ‘root’ specifies that the service should be provided in the root injector.<\/p>\n

Provider scope<\/strong><\/p>\n

When you add a service provider to the root application injector, it\u2019s available throughout the app. Additionally, these providers are also available to all the classes in the app as long they have the lookup token.<\/p>\n

You should always provide your service in the root injector unless there is a case where you want the service to be available only if the consumer imports a particular @NgModule.<\/p>\n

providedIn and NgModules<\/strong><\/p>\n

It’s also possible to specify that a service should be provided in a particular @NgModule. For example, if you don’t want UserService to be available to applications unless they import a UserModule you’ve created, you can specify that the service should be provided in the module:<\/p>\n

src\/app\/user.service.1.ts<\/u><\/p>\n

import { Injectable } from ‘@angular\/core’;<\/p>\n

import { UserModule } from ‘.\/user.module’;<\/p>\n

@Injectable({<\/p>\n

providedIn: UserModule,<\/p>\n

})<\/p>\n

export class UserService {<\/p>\n

}<\/p>\n

The example above shows the preferred way to provide a service in a module. This method is preferred because it enables tree-shaking of the service if nothing injects it. If it’s not possible to specify in the service which module should provide it, you can also declare a provider for the service within the module:<\/p>\n

src\/app\/user.module.ts<\/u><\/p>\n

import { NgModule } from ‘@angular\/core’;<\/p>\n

import { UserService } from ‘.\/user.service’;<\/p>\n

@NgModule({<\/p>\n

providers: [UserService],<\/p>\n

})<\/p>\n

export class UserModule {<\/p>\n

}<\/p>\n\n\n

Go back to Tutorial<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"

Go back to Tutorial A provider is an instruction to the DI system on how to obtain a value for a dependency. Most of the time, these dependencies are services that you create and provide. Providing a service If you already have a CLI generated app, create a service using the following CLI command in…<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"categories":[8294],"tags":[7330],"class_list":["post-71726","page","type-page","status-publish","hentry","category-angular-7","tag-providers-in-angular"],"acf":[],"yoast_head":"\nProviders in Angular - Tutorial<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.vskills.in\/certification\/tutorial\/providers-in-angular-2\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Providers in Angular - Tutorial\" \/>\n<meta property=\"og:description\" content=\"Go back to Tutorial A provider is an instruction to the DI system on how to obtain a value for a dependency. Most of the time, these dependencies are services that you create and provide. Providing a service If you already have a CLI generated app, create a service using the following CLI command in...\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.vskills.in\/certification\/tutorial\/providers-in-angular-2\/\" \/>\n<meta property=\"og:site_name\" content=\"Tutorial\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/vskills.in\/\" \/>\n<meta property=\"article:modified_time\" content=\"2024-04-12T08:52:40+00:00\" \/>\n<meta name=\"twitter:label1\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data1\" content=\"2 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.vskills.in\/certification\/tutorial\/providers-in-angular-2\/\",\"url\":\"https:\/\/www.vskills.in\/certification\/tutorial\/providers-in-angular-2\/\",\"name\":\"Providers in Angular - Tutorial\",\"isPartOf\":{\"@id\":\"https:\/\/www.vskills.in\/certification\/tutorial\/#website\"},\"datePublished\":\"2020-01-10T10:53:57+00:00\",\"dateModified\":\"2024-04-12T08:52:40+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/www.vskills.in\/certification\/tutorial\/providers-in-angular-2\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.vskills.in\/certification\/tutorial\/providers-in-angular-2\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.vskills.in\/certification\/tutorial\/providers-in-angular-2\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/www.vskills.in\/certification\/tutorial\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Providers in Angular\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.vskills.in\/certification\/tutorial\/#website\",\"url\":\"https:\/\/www.vskills.in\/certification\/tutorial\/\",\"name\":\"Tutorial\",\"description\":\"Vskills - A initiative in elearning and certification\",\"publisher\":{\"@id\":\"https:\/\/www.vskills.in\/certification\/tutorial\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/www.vskills.in\/certification\/tutorial\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/www.vskills.in\/certification\/tutorial\/#organization\",\"name\":\"Vskills\",\"url\":\"https:\/\/www.vskills.in\/certification\/tutorial\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.vskills.in\/certification\/tutorial\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/www.vskills.in\/certification\/tutorial\/wp-content\/uploads\/2017\/07\/vskills-min-logo.jpg\",\"contentUrl\":\"https:\/\/www.vskills.in\/certification\/tutorial\/wp-content\/uploads\/2017\/07\/vskills-min-logo.jpg\",\"width\":73,\"height\":55,\"caption\":\"Vskills\"},\"image\":{\"@id\":\"https:\/\/www.vskills.in\/certification\/tutorial\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.facebook.com\/vskills.in\/\",\"https:\/\/x.com\/vskills_in\",\"https:\/\/www.linkedin.com\/company-beta\/1371554\/\",\"https:\/\/www.youtube.com\/channel\/UCMWnscxPwRF_PqXo9B7q_Tw\"]}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Providers in Angular - Tutorial","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.vskills.in\/certification\/tutorial\/providers-in-angular-2\/","og_locale":"en_US","og_type":"article","og_title":"Providers in Angular - Tutorial","og_description":"Go back to Tutorial A provider is an instruction to the DI system on how to obtain a value for a dependency. Most of the time, these dependencies are services that you create and provide. Providing a service If you already have a CLI generated app, create a service using the following CLI command in...","og_url":"https:\/\/www.vskills.in\/certification\/tutorial\/providers-in-angular-2\/","og_site_name":"Tutorial","article_publisher":"https:\/\/www.facebook.com\/vskills.in\/","article_modified_time":"2024-04-12T08:52:40+00:00","twitter_misc":{"Est. reading time":"2 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/www.vskills.in\/certification\/tutorial\/providers-in-angular-2\/","url":"https:\/\/www.vskills.in\/certification\/tutorial\/providers-in-angular-2\/","name":"Providers in Angular - Tutorial","isPartOf":{"@id":"https:\/\/www.vskills.in\/certification\/tutorial\/#website"},"datePublished":"2020-01-10T10:53:57+00:00","dateModified":"2024-04-12T08:52:40+00:00","breadcrumb":{"@id":"https:\/\/www.vskills.in\/certification\/tutorial\/providers-in-angular-2\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.vskills.in\/certification\/tutorial\/providers-in-angular-2\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/www.vskills.in\/certification\/tutorial\/providers-in-angular-2\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.vskills.in\/certification\/tutorial\/"},{"@type":"ListItem","position":2,"name":"Providers in Angular"}]},{"@type":"WebSite","@id":"https:\/\/www.vskills.in\/certification\/tutorial\/#website","url":"https:\/\/www.vskills.in\/certification\/tutorial\/","name":"Tutorial","description":"Vskills - A initiative in elearning and certification","publisher":{"@id":"https:\/\/www.vskills.in\/certification\/tutorial\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.vskills.in\/certification\/tutorial\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www.vskills.in\/certification\/tutorial\/#organization","name":"Vskills","url":"https:\/\/www.vskills.in\/certification\/tutorial\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.vskills.in\/certification\/tutorial\/#\/schema\/logo\/image\/","url":"https:\/\/www.vskills.in\/certification\/tutorial\/wp-content\/uploads\/2017\/07\/vskills-min-logo.jpg","contentUrl":"https:\/\/www.vskills.in\/certification\/tutorial\/wp-content\/uploads\/2017\/07\/vskills-min-logo.jpg","width":73,"height":55,"caption":"Vskills"},"image":{"@id":"https:\/\/www.vskills.in\/certification\/tutorial\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/vskills.in\/","https:\/\/x.com\/vskills_in","https:\/\/www.linkedin.com\/company-beta\/1371554\/","https:\/\/www.youtube.com\/channel\/UCMWnscxPwRF_PqXo9B7q_Tw"]}]}},"_links":{"self":[{"href":"https:\/\/www.vskills.in\/certification\/tutorial\/wp-json\/wp\/v2\/pages\/71726","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.vskills.in\/certification\/tutorial\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.vskills.in\/certification\/tutorial\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.vskills.in\/certification\/tutorial\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.vskills.in\/certification\/tutorial\/wp-json\/wp\/v2\/comments?post=71726"}],"version-history":[{"count":4,"href":"https:\/\/www.vskills.in\/certification\/tutorial\/wp-json\/wp\/v2\/pages\/71726\/revisions"}],"predecessor-version":[{"id":87871,"href":"https:\/\/www.vskills.in\/certification\/tutorial\/wp-json\/wp\/v2\/pages\/71726\/revisions\/87871"}],"wp:attachment":[{"href":"https:\/\/www.vskills.in\/certification\/tutorial\/wp-json\/wp\/v2\/media?parent=71726"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.vskills.in\/certification\/tutorial\/wp-json\/wp\/v2\/categories?post=71726"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.vskills.in\/certification\/tutorial\/wp-json\/wp\/v2\/tags?post=71726"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}