41 lines
1.0 KiB
TypeScript
41 lines
1.0 KiB
TypeScript
// #docplaster
|
|
// #docregion
|
|
import { Component, ElementRef, Host, Inject, Optional } from '@angular/core';
|
|
|
|
import { HeroCacheService } from './hero-cache.service';
|
|
import { LoggerService } from './logger.service';
|
|
|
|
// #docregion component
|
|
@Component({
|
|
selector:'hero-contact',
|
|
template:`
|
|
<div>Phone #: {{phoneNumber}}
|
|
<span *ngIf="hasLogger">!!!</span></div>`
|
|
})
|
|
export class HeroContactComponent {
|
|
|
|
hasLogger = false;
|
|
|
|
constructor(
|
|
// #docregion ctor-params
|
|
@Host() // limit to the host component's instance of the HeroCacheService
|
|
private heroCache: HeroCacheService,
|
|
|
|
@Host() // limit search for logger; hides the application-wide logger
|
|
@Optional() // ok if the logger doesn't exist
|
|
private loggerService: LoggerService
|
|
// #enddocregion ctor-params
|
|
) {
|
|
if (loggerService) {
|
|
this.hasLogger = true;
|
|
loggerService.logInfo('HeroContactComponent can log!');
|
|
}
|
|
// #docregion ctor
|
|
}
|
|
// #enddocregion ctor
|
|
|
|
get phoneNumber() { return this.heroCache.hero.phone; }
|
|
|
|
}
|
|
// #enddocregion component
|