parent
91bb9d80ff
commit
d152ea293e
|
@ -178,7 +178,7 @@ figure.image-display
|
||||||
|
|
||||||
Accordingly, dependencies provided in the root `AppComponent` can be injected into *any* component *anywhere* in the application.
|
Accordingly, dependencies provided in the root `AppComponent` can be injected into *any* component *anywhere* in the application.
|
||||||
|
|
||||||
That isn't always desireable.
|
That isn't always desirable.
|
||||||
Sometimes we want to restrict service availability to a particular region of the application.
|
Sometimes we want to restrict service availability to a particular region of the application.
|
||||||
|
|
||||||
We can limit the scope of an injected service to a *branch* of the application hierarchy
|
We can limit the scope of an injected service to a *branch* of the application hierarchy
|
||||||
|
@ -277,7 +277,7 @@ a(id="qualify-dependency-lookup")
|
||||||
placing it in the `<ng-content>` slot of the `HeroBioComponent` template:
|
placing it in the `<ng-content>` slot of the `HeroBioComponent` template:
|
||||||
+makeExample('cb-dependency-injection/ts/app/hero-bio.component.ts','template','app/hero-bio.component.ts (template)')(format='.')
|
+makeExample('cb-dependency-injection/ts/app/hero-bio.component.ts','template','app/hero-bio.component.ts (template)')(format='.')
|
||||||
:marked
|
:marked
|
||||||
It looks like this, with the heroe's telephone number from `HeroContactComponent` projected above the hero description:
|
It looks like this, with the hero's telephone number from `HeroContactComponent` projected above the hero description:
|
||||||
figure.image-display
|
figure.image-display
|
||||||
img(src="/resources/images/cookbooks/dependency-injection/hero-bio-and-content.png" alt="bio and contact")
|
img(src="/resources/images/cookbooks/dependency-injection/hero-bio-and-content.png" alt="bio and contact")
|
||||||
:marked
|
:marked
|
||||||
|
@ -308,7 +308,7 @@ figure.image-display
|
||||||
:marked
|
:marked
|
||||||
If we comment out the `@Host()` decorator, Angular now walks up the injector ancestor tree
|
If we comment out the `@Host()` decorator, Angular now walks up the injector ancestor tree
|
||||||
until it finds the logger at the `AppComponent` level. The logger logic kicks in and the hero display updates
|
until it finds the logger at the `AppComponent` level. The logger logic kicks in and the hero display updates
|
||||||
with the gratuituous "!!!", indicating that the logger was found.
|
with the gratuitous "!!!", indicating that the logger was found.
|
||||||
figure.image-display
|
figure.image-display
|
||||||
img(src="/resources/images/cookbooks/dependency-injection/hero-bio-contact-no-host.png" alt="Without @Host")
|
img(src="/resources/images/cookbooks/dependency-injection/hero-bio-contact-no-host.png" alt="Without @Host")
|
||||||
:marked
|
:marked
|
||||||
|
@ -367,7 +367,7 @@ figure.image-display
|
||||||
|
|
||||||
Where did the injector get that value?
|
Where did the injector get that value?
|
||||||
It may already have that value in its internal container.
|
It may already have that value in its internal container.
|
||||||
It it doesn't, it may be able to make one with the help of a ***provider***.
|
If it doesn't, it may be able to make one with the help of a ***provider***.
|
||||||
A *provider* is a recipe for delivering a service associated with a *token*.
|
A *provider* is a recipe for delivering a service associated with a *token*.
|
||||||
.l-sub-section
|
.l-sub-section
|
||||||
:marked
|
:marked
|
||||||
|
|
Loading…
Reference in New Issue