| 
									
										
										
										
											2016-02-02 14:39:34 +01:00
										 |  |  | // #docregion
 | 
					
						
							| 
									
										
										
										
											2016-05-03 14:06:32 +02:00
										 |  |  | import { Component }      from '@angular/core'; | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  | import { VoterComponent } from './voter.component'; | 
					
						
							| 
									
										
										
										
											2016-02-02 14:39:34 +01:00
										 |  |  | 
 | 
					
						
							|  |  |  | @Component({ | 
					
						
							|  |  |  |   selector: 'vote-taker', | 
					
						
							|  |  |  |   template: `
 | 
					
						
							|  |  |  |     <h2>Should mankind colonize the Universe?</h2> | 
					
						
							|  |  |  |     <h3>Agree: {{agreed}}, Disagree: {{disagreed}}</h3> | 
					
						
							| 
									
										
										
										
											2016-04-29 01:36:35 +01:00
										 |  |  |     <my-voter *ngFor="let voter of voters" | 
					
						
							| 
									
										
										
										
											2016-02-02 14:39:34 +01:00
										 |  |  |       [name]="voter" | 
					
						
							|  |  |  |       (onVoted)="onVoted($event)"> | 
					
						
							|  |  |  |     </my-voter> | 
					
						
							|  |  |  |   `,
 | 
					
						
							|  |  |  |   directives: [VoterComponent] | 
					
						
							|  |  |  | }) | 
					
						
							|  |  |  | export class VoteTakerComponent { | 
					
						
							|  |  |  |   agreed = 0; | 
					
						
							|  |  |  |   disagreed = 0; | 
					
						
							| 
									
										
										
										
											2016-06-08 01:06:25 +02:00
										 |  |  |   voters = ['Mr. IQ', 'Ms. Universe', 'Bombasto']; | 
					
						
							| 
									
										
										
										
											2016-02-02 14:39:34 +01:00
										 |  |  | 
 | 
					
						
							|  |  |  |   onVoted(agreed: boolean) { | 
					
						
							|  |  |  |     agreed ? this.agreed++ : this.disagreed++; | 
					
						
							|  |  |  |   } | 
					
						
							|  |  |  | } | 
					
						
							| 
									
										
										
										
											2016-04-29 01:36:35 +01:00
										 |  |  | // #enddocregion
 |