| 
									
										
										
										
											2016-12-11 21:42:20 -08:00
										 |  |  | /** | 
					
						
							|  |  |  |  * @license | 
					
						
							|  |  |  |  * Copyright Google Inc. All Rights Reserved. | 
					
						
							|  |  |  |  * | 
					
						
							|  |  |  |  * Use of this source code is governed by an MIT-style license that can be | 
					
						
							|  |  |  |  * found in the LICENSE file at https://angular.io/license
 | 
					
						
							|  |  |  |  */ | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  | import {Component, NgModule, OnInit, TemplateRef, ViewChild} from '@angular/core'; | 
					
						
							|  |  |  | import {BrowserModule} from '@angular/platform-browser'; | 
					
						
							|  |  |  | import {Subject} from 'rxjs/Subject'; | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  | // #docregion NgTemplateOutlet
 | 
					
						
							|  |  |  | @Component({ | 
					
						
							|  |  |  |   selector: 'ng-template-outlet-example', | 
					
						
							|  |  |  |   template: `
 | 
					
						
							|  |  |  |     <ng-container *ngTemplateOutlet="greet"></ng-container> | 
					
						
							|  |  |  |     <hr> | 
					
						
							|  |  |  |     <ng-container *ngTemplateOutlet="eng; context: myContext"></ng-container> | 
					
						
							|  |  |  |     <hr> | 
					
						
							|  |  |  |     <ng-container *ngTemplateOutlet="svk; context: myContext"></ng-container> | 
					
						
							|  |  |  |     <hr> | 
					
						
							|  |  |  |      | 
					
						
							| 
									
										
										
										
											2017-01-09 13:16:46 -08:00
										 |  |  |     <ng-template #greet><span>Hello</span></ng-template> | 
					
						
							|  |  |  |     <ng-template #eng let-name><span>Hello {{name}}!</span></ng-template> | 
					
						
							|  |  |  |     <ng-template #svk let-person="localSk"><span>Ahoj {{person}}!</span></ng-template> | 
					
						
							| 
									
										
										
										
											2016-12-11 21:42:20 -08:00
										 |  |  | `
 | 
					
						
							|  |  |  | }) | 
					
						
							|  |  |  | class NgTemplateOutletExample { | 
					
						
							|  |  |  |   myContext = {$implicit: 'World', localSk: 'Svet'}; | 
					
						
							|  |  |  | } | 
					
						
							|  |  |  | // #enddocregion
 | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  | @Component({ | 
					
						
							|  |  |  |   selector: 'example-app', | 
					
						
							|  |  |  |   template: `<ng-template-outlet-example></ng-template-outlet-example>` | 
					
						
							|  |  |  | }) | 
					
						
							|  |  |  | class ExampleApp { | 
					
						
							|  |  |  | } | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  | @NgModule({ | 
					
						
							|  |  |  |   imports: [BrowserModule], | 
					
						
							|  |  |  |   declarations: [ExampleApp, NgTemplateOutletExample], | 
					
						
							|  |  |  |   bootstrap: [ExampleApp] | 
					
						
							|  |  |  | }) | 
					
						
							|  |  |  | export class AppModule { | 
					
						
							|  |  |  | } |