fix aot-compiler, router and upgrade

This commit is contained in:
Rex YE 2016-11-22 15:21:36 +00:00
parent b3555bf990
commit 7f022c153b
3 changed files with 18 additions and 7 deletions

View File

@ -561,7 +561,7 @@ a#toh
***index.html*** ***index.html***
***Index.html*** ***index.html***
The JiT and AoT apps require their own `index.html` files because they setup and launch so differently. The JiT and AoT apps require their own `index.html` files because they setup and launch so differently.
**Put the AoT version in the `/aot` folder** because two `index.html` files can't be in the same folder. **Put the AoT version in the `/aot` folder** because two `index.html` files can't be in the same folder.
@ -570,6 +570,7 @@ a#toh
**将AoT版本放在`/aot`目录**,因为两个`index.html`文件不能位于同一个目录。 **将AoT版本放在`/aot`目录**,因为两个`index.html`文件不能位于同一个目录。
Here they are for comparison: Here they are for comparison:
下面是它们的比较: 下面是它们的比较:
+makeTabs( +makeTabs(
@ -594,6 +595,8 @@ a#toh
***main.ts*** ***main.ts***
***main.ts***
JiT and AoT applications boot in much the same way but require different Angular libraries to do so. JiT and AoT applications boot in much the same way but require different Angular libraries to do so.
The key differences, covered in the [Bootstrap](#bootstrap) section above, The key differences, covered in the [Bootstrap](#bootstrap) section above,
are evident in these `main` files which can and should reside in the same folder: are evident in these `main` files which can and should reside in the same folder:
@ -612,6 +615,7 @@ a#toh
:marked :marked
***Component-relative Template URLS*** ***Component-relative Template URLS***
***相对组件的模板路径*** ***相对组件的模板路径***
The AoT compiler requires that `@Component` URLS for external templates and css files be _component-relative_. The AoT compiler requires that `@Component` URLS for external templates and css files be _component-relative_.
@ -640,6 +644,7 @@ a#toh
设置一个全局`module`是暂时的权宜之计。 设置一个全局`module`是暂时的权宜之计。
:marked :marked
***TypeScript configuration*** ***TypeScript configuration***
***TypeScript配置*** ***TypeScript配置***
JiT-compiled applications transpile to `commonjs` modules. JiT-compiled applications transpile to `commonjs` modules.

View File

@ -423,7 +423,7 @@ table
td td
p <code>Router</code> p <code>Router</code>
p <code>Router</code>(路由器) p <code>Router</code>(路由器)
td. td
p. p.
Displays the application component for the active URL. Displays the application component for the active URL.
Manages navigation from one component to the next. Manages navigation from one component to the next.
@ -2295,7 +2295,11 @@ h3#merge-hero-routes 把hero模块导入到AppModule中
When the user selects a crisis, the app navigates to the `CrisisDetailComponent` When the user selects a crisis, the app navigates to the `CrisisDetailComponent`
for display and editing of the crisis name. for display and editing of the crisis name.
Voilà, another feature module! `Crisis`有`id`和`name`,和`Hero`一样。
新的`CrisisListComponent`显示了危机列表。
当用户选择一个危机时,应用导航到`CrisisDetailComponent`,显示和编辑危机名字。
Voila, another feature module!
真棒!另一个特性模块诞生了 真棒!另一个特性模块诞生了

View File

@ -1310,7 +1310,7 @@ figure
:marked :marked
### Switching to TypeScript ### Switching to TypeScript
## 切换到TypeScript ### 切换到TypeScript
Since we're going to be writing our Angular 2 code in TypeScript, it makes sense to Since we're going to be writing our Angular 2 code in TypeScript, it makes sense to
bring in the TypeScript compiler even before we begin upgrading. bring in the TypeScript compiler even before we begin upgrading.
@ -1665,13 +1665,15 @@ code-example(format="").
attached to the `<html>` element of the host page. This will no longer work with attached to the `<html>` element of the host page. This will no longer work with
Angular 2. We should switch to a JavaScript-driven bootstrap instead. Angular 2. We should switch to a JavaScript-driven bootstrap instead.
我们的应用现在是使用宿主页面中附加到`<html>`元素上的`ng-app`指令引导的。
但在Angular 2中它不再工作了。我们得切换成JavaScript驱动的引导方式。
So, remove the `ng-app` attribute from `index.html`, and instead boostrap via `app/main.ts`. So, remove the `ng-app` attribute from `index.html`, and instead boostrap via `app/main.ts`.
This file has been configured as the application entrypoint in `systemjs.config.js`, This file has been configured as the application entrypoint in `systemjs.config.js`,
so it is already being loaded by the browser. so it is already being loaded by the browser.
我们的应用现在是使用宿主页面中附加到`<html>`元素上的`ng-app`指令引导的。 所以,从`index.html`中移除`ng-app`属性,并把这些加载`main.ts`中。
但在Angular 2中它不再工作了。我们得切换成JavaScript驱动的引导方式。 在`systemjs.config.js`中已经将此文件配置为应用的入口,所以它已被浏览器所加载。
所以,从`index.html`中移除`ng-app`属性,并把这些加载`main.ts`中:
+makeExample('upgrade-phonecat-2-hybrid/ts/app/main.ts', 'bootstrap') +makeExample('upgrade-phonecat-2-hybrid/ts/app/main.ts', 'bootstrap')