docs(toh5): add moduleId information (#2597)
This commit is contained in:
		
							parent
							
								
									94b8793d70
								
							
						
					
					
						commit
						e503efe8c8
					
				@ -7,17 +7,18 @@ import { Router } from '@angular/router';
 | 
			
		||||
 | 
			
		||||
import { Hero } from './hero';
 | 
			
		||||
import { HeroService } from './hero.service';
 | 
			
		||||
 | 
			
		||||
  // #docregion metadata
 | 
			
		||||
@Component({
 | 
			
		||||
  moduleId: module.id,
 | 
			
		||||
  selector: 'my-dashboard',
 | 
			
		||||
  // #docregion templateUrl
 | 
			
		||||
  templateUrl: 'dashboard.component.html',
 | 
			
		||||
  // #enddocregion templateUrl
 | 
			
		||||
  // #enddocregion metadata
 | 
			
		||||
  // #docregion css
 | 
			
		||||
  styleUrls: [ 'dashboard.component.css' ]
 | 
			
		||||
  // #enddocregion css
 | 
			
		||||
  // #docregion metadata
 | 
			
		||||
})
 | 
			
		||||
// #enddocregion metadata
 | 
			
		||||
// #docregion component
 | 
			
		||||
export class DashboardComponent implements OnInit {
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
@ -6,16 +6,16 @@ import { Location }               from '@angular/common';
 | 
			
		||||
 | 
			
		||||
import { Hero }         from './hero';
 | 
			
		||||
import { HeroService }  from './hero.service';
 | 
			
		||||
 | 
			
		||||
// #docregion metadata
 | 
			
		||||
@Component({
 | 
			
		||||
  moduleId: module.id,
 | 
			
		||||
  selector: 'my-hero-detail',
 | 
			
		||||
  // #docregion templateUrl
 | 
			
		||||
  templateUrl: 'hero-detail.component.html',
 | 
			
		||||
  // #enddocregion templateUrl, v2
 | 
			
		||||
  // #enddocregion metadata, v2
 | 
			
		||||
  styleUrls: [ 'hero-detail.component.css' ]
 | 
			
		||||
  // #docregion v2
 | 
			
		||||
  // #docregion metadata, v2
 | 
			
		||||
})
 | 
			
		||||
// #enddocregion metadata
 | 
			
		||||
// #docregion implement
 | 
			
		||||
export class HeroDetailComponent implements OnInit {
 | 
			
		||||
// #enddocregion implement
 | 
			
		||||
 | 
			
		||||
@ -8,7 +8,9 @@ import { HeroService } from './hero.service';
 | 
			
		||||
 | 
			
		||||
// #docregion renaming, metadata
 | 
			
		||||
@Component({
 | 
			
		||||
  // #enddocregion renaming
 | 
			
		||||
  moduleId: module.id,
 | 
			
		||||
  // #docregion renaming
 | 
			
		||||
  selector: 'my-heroes',
 | 
			
		||||
  // #enddocregion renaming
 | 
			
		||||
  templateUrl: 'heroes.component.html',
 | 
			
		||||
 | 
			
		||||
@ -367,7 +367,7 @@ block redirect-vs-use-as-default
 | 
			
		||||
 | 
			
		||||
  Set the `moduleId` property to `module.id` for module-relative loading of the `templateUrl`.
 | 
			
		||||
 | 
			
		||||
+makeExcerpt('app/dashboard.component.ts', 'templateUrl')
 | 
			
		||||
+makeExcerpt('app/dashboard.component.ts', 'metadata')
 | 
			
		||||
 | 
			
		||||
:marked
 | 
			
		||||
  Create that file with this content:
 | 
			
		||||
@ -585,9 +585,9 @@ block extract-id
 | 
			
		||||
+makeExample('app/hero-detail.component.html')
 | 
			
		||||
 | 
			
		||||
:marked
 | 
			
		||||
  We update the component metadata with a `templateUrl` pointing to the template file that we just created.
 | 
			
		||||
  We update the component metadata with a `moduleId` and a `templateUrl` pointing to the template file that we just created.
 | 
			
		||||
 | 
			
		||||
+makeExcerpt('app/hero-detail.component.ts', 'templateUrl')
 | 
			
		||||
+makeExcerpt('app/hero-detail.component.ts', 'metadata')
 | 
			
		||||
 | 
			
		||||
:marked
 | 
			
		||||
  Refresh the browser and see the results.
 | 
			
		||||
@ -759,7 +759,7 @@ figure.image-display
 | 
			
		||||
  1. *Cut-and-paste* the template contents into a new <span ngio-ex>heroes.component.html</span> file.
 | 
			
		||||
  1. *Cut-and-paste* the styles contents into a new <span ngio-ex>heroes.component.css</span> file.
 | 
			
		||||
  1. *Set* the component metadata's `templateUrl` and `styleUrls` properties to refer to both files.
 | 
			
		||||
  1. *Set* the `moduleId` property to `module.id` so that 'templateUrl` and `styleUrls` are relative to the component.
 | 
			
		||||
  1. *Set* the `moduleId` property to `module.id` so that `templateUrl` and `styleUrls` are relative to the component.
 | 
			
		||||
 | 
			
		||||
.l-sub-section
 | 
			
		||||
  :marked
 | 
			
		||||
 | 
			
		||||
		Loading…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user