docs(cb-aot): add missing module.id to sample (#2908)

This commit is contained in:
Torgeir Helgevold 2016-11-30 02:52:20 -05:00 committed by Ward Bell
parent 1d5e7c30be
commit 5b294e3c5b
3 changed files with 22 additions and 18 deletions

View File

@ -1,8 +1,8 @@
// #docregion // #docregion
// #docregion
import { Component } from '@angular/core'; import { Component } from '@angular/core';
@Component({ @Component({
moduleId: module.id,
selector: 'my-app', selector: 'my-app',
templateUrl: 'app.component.html' templateUrl: 'app.component.html'
}) })

View File

@ -9,7 +9,9 @@
<script src="node_modules/core-js/client/shim.min.js"></script> <script src="node_modules/core-js/client/shim.min.js"></script>
<script src="node_modules/zone.js/dist/zone.js"></script> <script src="node_modules/zone.js/dist/zone.js"></script>
<!-- #docregion moduleId -->
<script>window.module = 'aot';</script>
<!-- #enddocregion moduleId -->
</head> </head>
<!-- #docregion bundle --> <!-- #docregion bundle -->

View File

@ -129,6 +129,24 @@ code-example(format='.').
The `"skipMetadataEmit" : true` property prevents the compiler from generating metadata files with the compiled application. The `"skipMetadataEmit" : true` property prevents the compiler from generating metadata files with the compiled application.
Metadata files are not necessary when targeting TypeScript files, so there is no reason to include them. Metadata files are not necessary when targeting TypeScript files, so there is no reason to include them.
:marked
***Component-relative Template URLS***
The AoT compiler requires that `@Component` URLS for external templates and css files be _component-relative_.
That means that the value of `@Component.templateUrl` is a URL value _relative_ to the component class file.
For example, an `'app.component.html'` URL means that the template file is a sibling of its companion `app.component.ts` file.
While JiT app URLs are more flexible, stick with _component-relative_ URLs for compatibility with AoT compilation.
JiT-compiled applications that use the SystemJS loader and _component-relative_ URLs *must set the* `@Component.moduleId` *property to* `module.id`.
The `module` object is undefined when an AoT-compiled app runs.
The app fails with a null reference error unless you assign a global `module` value in the `index.html` like this:
+makeExample('cb-aot-compiler/ts/index.html','moduleId')(format='.')
.l-sub-section
:marked
Setting a global `module` is a temporary expedient.
:marked
### Compiling the application ### Compiling the application
Initiate AoT compilation from the command line using the previously installed `ngc` compiler by executing: Initiate AoT compilation from the command line using the previously installed `ngc` compiler by executing:
@ -376,22 +394,6 @@ a#toh
app/main.ts (JiT)` app/main.ts (JiT)`
) )
:marked
***Component-relative Template URLS***
The AoT compiler requires that `@Component` URLS for external templates and css files be _component-relative_.
That means that the value of `@Component.templateUrl` is a URL value _relative_ to the component class file.
For example, a `'hero.component.html'` URL means that the template file is a sibling of its companion `hero.component.ts` file.
While JiT app URLs are more flexible, stick with _component-relative_ URLs for compatibility with AoT compilation.
JiT-compiled applications that use the SystemJS loader and _component-relative_ URLs *must set the* `@Component.moduleId` *property to* `module.id`.
The `module` object is undefined when an AoT-compiled app runs.
The app fails with a null reference error unless you assign a global `module` value in the `index.html` like this:
+makeExample('toh-6/ts/aot/index.html','moduleId')(format='.')
.l-sub-section
:marked
Setting a global `module` is a temporary expedient.
:marked :marked
***TypeScript configuration*** ***TypeScript configuration***