| 
									
										
										
										
											2016-03-26 12:18:13 -04:00
										 |  |  | /* tslint:disable:one-line:check-open-brace*/ | 
					
						
							|  |  |  | // #docplaster
 | 
					
						
							|  |  |  | // #docregion opaque-token
 | 
					
						
							| 
									
										
										
										
											2016-05-03 14:06:32 +02:00
										 |  |  | import { OpaqueToken } from '@angular/core'; | 
					
						
							| 
									
										
										
										
											2016-03-26 12:18:13 -04:00
										 |  |  | 
 | 
					
						
							|  |  |  | export const TITLE = new OpaqueToken('title'); | 
					
						
							|  |  |  | // #enddocregion opaque-token
 | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  | // #docregion hero-of-the-month
 | 
					
						
							| 
									
										
										
										
											2016-06-03 18:00:53 +02:00
										 |  |  | import { Component, Inject } from '@angular/core'; | 
					
						
							| 
									
										
										
										
											2016-03-26 12:18:13 -04:00
										 |  |  | 
 | 
					
						
							|  |  |  | import { DateLoggerService, | 
					
						
							|  |  |  |          MinimalLogger }     from './date-logger.service'; | 
					
						
							|  |  |  | import { Hero }              from './hero'; | 
					
						
							|  |  |  | import { HeroService }       from './hero.service'; | 
					
						
							|  |  |  | import { LoggerService }     from './logger.service'; | 
					
						
							|  |  |  | import { RUNNERS_UP, | 
					
						
							|  |  |  |          runnersUpFactory }  from './runners-up'; | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  | // #enddocregion hero-of-the-month
 | 
					
						
							|  |  |  | // #docregion some-hero
 | 
					
						
							|  |  |  | const someHero = new Hero(42, 'Magma', 'Had a great month!', '555-555-5555'); | 
					
						
							|  |  |  | // #enddocregion some-hero
 | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  | const template = `
 | 
					
						
							|  |  |  |   <h3>{{title}}</h3> | 
					
						
							|  |  |  |   <div>Winner: <strong>{{heroOfTheMonth.name}}</strong></div> | 
					
						
							|  |  |  |   <div>Reason for award: <strong>{{heroOfTheMonth.description}}</strong></div> | 
					
						
							| 
									
										
										
										
											2016-05-16 21:56:13 -04:00
										 |  |  |   <div>Runners-up: <strong id="rups1">{{runnersUp}}</strong></div> | 
					
						
							| 
									
										
										
										
											2016-03-26 12:18:13 -04:00
										 |  |  | 
 | 
					
						
							|  |  |  |   <p>Logs:</p> | 
					
						
							|  |  |  |   <div id="logs"> | 
					
						
							| 
									
										
										
										
											2016-04-29 01:36:35 +01:00
										 |  |  |     <div *ngFor="let log of logs">{{log}}</div> | 
					
						
							| 
									
										
										
										
											2016-03-26 12:18:13 -04:00
										 |  |  |   </div> | 
					
						
							|  |  |  |   `;
 | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  | // #docregion hero-of-the-month
 | 
					
						
							|  |  |  | @Component({ | 
					
						
							|  |  |  |   selector: 'hero-of-the-month', | 
					
						
							|  |  |  |   template: template, | 
					
						
							|  |  |  |   providers: [ | 
					
						
							|  |  |  |     // #docregion use-value
 | 
					
						
							| 
									
										
										
										
											2016-06-03 18:00:53 +02:00
										 |  |  |     { provide: Hero,          useValue:    someHero }, | 
					
						
							| 
									
										
										
										
											2016-03-26 12:18:13 -04:00
										 |  |  |     // #docregion provide-opaque-token
 | 
					
						
							| 
									
										
										
										
											2016-06-03 18:00:53 +02:00
										 |  |  |     { provide: TITLE,         useValue:   'Hero of the Month' }, | 
					
						
							| 
									
										
										
										
											2016-03-26 12:18:13 -04:00
										 |  |  |     // #enddocregion provide-opaque-token
 | 
					
						
							|  |  |  |     // #enddocregion use-value
 | 
					
						
							|  |  |  |     // #docregion use-class
 | 
					
						
							| 
									
										
										
										
											2016-06-03 18:00:53 +02:00
										 |  |  |     { provide: HeroService,   useClass:    HeroService }, | 
					
						
							|  |  |  |     { provide: LoggerService, useClass:    DateLoggerService }, | 
					
						
							| 
									
										
										
										
											2016-03-26 12:18:13 -04:00
										 |  |  |     // #enddocregion use-class
 | 
					
						
							|  |  |  |     // #docregion use-existing
 | 
					
						
							| 
									
										
										
										
											2016-06-03 18:00:53 +02:00
										 |  |  |     { provide: MinimalLogger, useExisting: LoggerService }, | 
					
						
							| 
									
										
										
										
											2016-03-26 12:18:13 -04:00
										 |  |  |     // #enddocregion use-existing
 | 
					
						
							|  |  |  |     // #docregion provide-opaque-token, use-factory
 | 
					
						
							| 
									
										
										
										
											2016-06-03 18:00:53 +02:00
										 |  |  |     { provide: RUNNERS_UP,    useFactory:  runnersUpFactory(2), deps: [Hero, HeroService] } | 
					
						
							| 
									
										
										
										
											2016-03-26 12:18:13 -04:00
										 |  |  |     // #enddocregion provide-opaque-token, use-factory
 | 
					
						
							|  |  |  |   ] | 
					
						
							|  |  |  | }) | 
					
						
							|  |  |  | export class HeroOfTheMonthComponent { | 
					
						
							|  |  |  |   logs: string[] = []; | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  | // #docregion ctor-signature
 | 
					
						
							|  |  |  |   constructor( | 
					
						
							|  |  |  |       logger: MinimalLogger, | 
					
						
							|  |  |  |       public heroOfTheMonth: Hero, | 
					
						
							|  |  |  |       @Inject(RUNNERS_UP) public runnersUp: string, | 
					
						
							|  |  |  |       @Inject(TITLE) public title: string) | 
					
						
							|  |  |  | // #enddocregion ctor-signature
 | 
					
						
							|  |  |  |   { | 
					
						
							|  |  |  |     this.logs = logger.logs; | 
					
						
							|  |  |  |     logger.logInfo('starting up'); | 
					
						
							|  |  |  |   } | 
					
						
							|  |  |  | } | 
					
						
							|  |  |  | // #enddocregion hero-of-the-month
 |