docs(aio): revert file-trees back to original structure
This is an auto-migration from angular.io
This commit is contained in:
Peter Bacon Darwin
Igor Minar
parent
69b37fff26
commit
28c2a71cfc
@ -197,89 +197,105 @@ All Angular components, templates, styles, images, and anything else your app ne
|
|||||||
Any files outside of this folder are meant to support building your app.
|
Any files outside of this folder are meant to support building your app.
|
||||||
|
|
||||||
|
|
||||||
<aio-filetree>
|
<div class='filetree'>
|
||||||
|
|
||||||
<aio-folder>
|
<div class='file'>
|
||||||
src
|
src
|
||||||
<aio-folder>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
app
|
app
|
||||||
<aio-file>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
app.component.css
|
app.component.css
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
app.component.html
|
app.component.html
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
app.component.spec.ts
|
app.component.spec.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
app.component.ts
|
app.component.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
app.module.ts
|
app.module.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
<aio-folder>
|
<div class='file'>
|
||||||
assets
|
assets
|
||||||
<aio-file>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
.gitkeep
|
.gitkeep
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
<aio-folder>
|
<div class='file'>
|
||||||
environments
|
environments
|
||||||
<aio-file>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
environment.prod.ts
|
environment.prod.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
environment.ts
|
environment.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
favicon.ico
|
favicon.ico
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
index.html
|
index.html
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
main.ts
|
main.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
polyfills.ts
|
polyfills.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
styles.css
|
styles.css
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
test.ts
|
test.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
tsconfig.app.json
|
tsconfig.app.json
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
tsconfig.spec.json
|
tsconfig.spec.json
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
</aio-filetree>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
@ -505,73 +521,81 @@ Other files help you build, test, maintain, document, and deploy the app.
|
|||||||
These files go in the root folder next to `src/`.
|
These files go in the root folder next to `src/`.
|
||||||
|
|
||||||
|
|
||||||
<aio-filetree>
|
<div class='filetree'>
|
||||||
|
|
||||||
<aio-folder>
|
<div class='file'>
|
||||||
my-app
|
my-app
|
||||||
<aio-folder>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
e2e
|
e2e
|
||||||
<aio-file>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
app.e2e-spec.ts
|
app.e2e-spec.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
app.po.ts
|
app.po.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
tsconfig.e2e.json
|
tsconfig.e2e.json
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
node_modules/...
|
node_modules/...
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
src/...
|
src/...
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
.angular-cli.json
|
.angular-cli.json
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
.editorconfig
|
.editorconfig
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
.gitignore
|
.gitignore
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
karma.conf.js
|
karma.conf.js
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
package.json
|
package.json
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
protractor.conf.js
|
protractor.conf.js
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
README.md
|
README.md
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
tsconfig.json
|
tsconfig.json
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
tslint.json
|
tslint.json
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
</aio-filetree>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|||||||
@ -925,61 +925,73 @@ framework features to provide support for data modification, validation, and mor
|
|||||||
The final project folder structure should look like this:
|
The final project folder structure should look like this:
|
||||||
|
|
||||||
|
|
||||||
<aio-filetree>
|
<div class='filetree'>
|
||||||
|
|
||||||
<aio-folder>
|
<div class='file'>
|
||||||
angular-forms
|
angular-forms
|
||||||
<aio-folder>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
src
|
src
|
||||||
<aio-folder>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
app
|
app
|
||||||
<aio-file>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
app.component.ts
|
app.component.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
app.module.ts
|
app.module.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
hero.ts
|
hero.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
hero-form.component.html
|
hero-form.component.html
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
hero-form.component.ts
|
hero-form.component.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
main.ts
|
main.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
tsconfig.json
|
tsconfig.json
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
index.html
|
index.html
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
node_modules ...
|
node_modules ...
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
package.json
|
package.json
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
</aio-filetree>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|||||||
@ -623,53 +623,61 @@ Everything is in place to run the application with its contact editor.
|
|||||||
|
|
||||||
The app file structure looks like this:
|
The app file structure looks like this:
|
||||||
|
|
||||||
<aio-filetree>
|
<div class='filetree'>
|
||||||
|
|
||||||
<aio-folder>
|
<div class='file'>
|
||||||
app
|
app
|
||||||
<aio-file>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
app.component.ts
|
app.component.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
app.module.ts
|
app.module.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
highlight.directive.ts
|
highlight.directive.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
title.component.(html|ts)
|
title.component.(html|ts)
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
user.service.ts
|
user.service.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-folder>
|
<div class='file'>
|
||||||
contact
|
contact
|
||||||
<aio-file>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
awesome.pipe.ts
|
awesome.pipe.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
contact.component.(css|html|ts)
|
contact.component.(css|html|ts)
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
contact.service.ts
|
contact.service.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
highlight.directive.ts
|
highlight.directive.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
</aio-filetree>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
@ -1120,41 +1128,45 @@ The `HeroModule` is a bit more complex than the `CrisisModule`, which makes it
|
|||||||
a more interesting and useful example. Its file structure is as follows:
|
a more interesting and useful example. Its file structure is as follows:
|
||||||
|
|
||||||
|
|
||||||
<aio-filetree>
|
<div class='filetree'>
|
||||||
|
|
||||||
<aio-folder>
|
<div class='file'>
|
||||||
hero
|
hero
|
||||||
<aio-file>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
hero-detail.component.ts
|
hero-detail.component.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
hero-list.component.ts
|
hero-list.component.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
hero.component.ts
|
hero.component.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
hero.module.ts
|
hero.module.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
hero-routing.module.ts
|
hero-routing.module.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
hero.service.ts
|
hero.service.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
highlight.directive.ts
|
highlight.directive.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
</aio-filetree>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|||||||
@ -1027,65 +1027,77 @@ Here are the details for readers inclined to build the sample through to this mi
|
|||||||
The starter app's structure looks like this:
|
The starter app's structure looks like this:
|
||||||
|
|
||||||
|
|
||||||
<aio-filetree>
|
<div class='filetree'>
|
||||||
|
|
||||||
<aio-folder>
|
<div class='file'>
|
||||||
router-sample
|
router-sample
|
||||||
<aio-folder>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
src
|
src
|
||||||
<aio-folder>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
app
|
app
|
||||||
<aio-file>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
app.component.ts
|
app.component.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
app.module.ts
|
app.module.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
crisis-list.component.ts
|
crisis-list.component.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
hero-list.component.ts
|
hero-list.component.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
not-found.component.ts
|
not-found.component.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
main.ts
|
main.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
index.html
|
index.html
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
styles.css
|
styles.css
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
tsconfig.json
|
tsconfig.json
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
node_modules ...
|
node_modules ...
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
package.json
|
package.json
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
</aio-filetree>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
@ -1287,29 +1299,33 @@ Follow these steps:
|
|||||||
When you're done, you'll have these *hero management* files:
|
When you're done, you'll have these *hero management* files:
|
||||||
|
|
||||||
|
|
||||||
<aio-filetree>
|
<div class='filetree'>
|
||||||
|
|
||||||
<aio-folder>
|
<div class='file'>
|
||||||
src/app/heroes
|
src/app/heroes
|
||||||
<aio-file>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
hero-detail.component.ts
|
hero-detail.component.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
hero-list.component.ts
|
hero-list.component.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
hero.service.ts
|
hero.service.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
heroes.module.ts
|
heroes.module.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
</aio-filetree>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
@ -2180,85 +2196,105 @@ You've learned how to do the following:
|
|||||||
After these changes, the folder structure looks like this:
|
After these changes, the folder structure looks like this:
|
||||||
|
|
||||||
|
|
||||||
<aio-filetree>
|
<div class='filetree'>
|
||||||
|
|
||||||
<aio-folder>
|
<div class='file'>
|
||||||
router-sample
|
router-sample
|
||||||
<aio-folder>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
src
|
src
|
||||||
<aio-folder>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
app
|
app
|
||||||
<aio-folder>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
heroes
|
heroes
|
||||||
<aio-file>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
hero-detail.component.ts
|
hero-detail.component.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
hero-list.component.ts
|
hero-list.component.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
hero.service.ts
|
hero.service.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
heroes.module.ts
|
heroes.module.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
heroes-routing.module.ts
|
heroes-routing.module.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
app.component.ts
|
app.component.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
app.module.ts
|
app.module.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
app-routing.module.ts
|
app-routing.module.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
crisis-list.component.ts
|
crisis-list.component.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
main.ts
|
main.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
index.html
|
index.html
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
styles.css
|
styles.css
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
tsconfig.json
|
tsconfig.json
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
node_modules ...
|
node_modules ...
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
package.json
|
package.json
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
</aio-filetree>
|
<Here>
|
||||||
|
are the relevant files for this version of the sample application.
|
||||||
|
</Here>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
@ -2910,37 +2946,41 @@ Create an `admin` folder with a feature module file, a routing configuration fil
|
|||||||
The admin feature file structure looks like this:
|
The admin feature file structure looks like this:
|
||||||
|
|
||||||
|
|
||||||
<aio-filetree>
|
<div class='filetree'>
|
||||||
|
|
||||||
<aio-folder>
|
<div class='file'>
|
||||||
src/app/admin
|
src/app/admin
|
||||||
<aio-file>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
admin-dashboard.component.ts
|
admin-dashboard.component.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
admin.component.ts
|
admin.component.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
admin.module.ts
|
admin.module.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
admin-routing.module.ts
|
admin-routing.module.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
manage-crises.component.ts
|
manage-crises.component.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
manage-heroes.component.ts
|
manage-heroes.component.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
</aio-filetree>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|||||||
@ -153,29 +153,37 @@ most of which you can [learn about later](guide/setup-systemjs-anatomy "Setup An
|
|||||||
Focus on the following three TypeScript (`.ts`) files in the **`/src`** folder.
|
Focus on the following three TypeScript (`.ts`) files in the **`/src`** folder.
|
||||||
|
|
||||||
|
|
||||||
<aio-filetree>
|
<div class='filetree'>
|
||||||
|
|
||||||
<aio-folder>
|
<div class='file'>
|
||||||
src
|
src
|
||||||
<aio-folder>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
app
|
app
|
||||||
<aio-file>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
app.component.ts
|
app.component.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
app.module.ts
|
app.module.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
main.ts
|
main.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
</aio-filetree>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|||||||
@ -2459,177 +2459,229 @@ But if something is not obvious or departs from a convention, then spell it out.
|
|||||||
Here is a compliant folder and file structure:
|
Here is a compliant folder and file structure:
|
||||||
|
|
||||||
|
|
||||||
<aio-filetree>
|
<div class='filetree'>
|
||||||
|
|
||||||
<aio-folder>
|
<div class='file'>
|
||||||
<project root>
|
<project root>
|
||||||
<aio-folder>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
src
|
src
|
||||||
<aio-folder>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
app
|
app
|
||||||
<aio-folder>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
core
|
core
|
||||||
<aio-file>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
core.module.ts
|
core.module.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
exception.service.ts|spec.ts
|
exception.service.ts|spec.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
user-profile.service.ts|spec.ts
|
user-profile.service.ts|spec.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
<aio-folder>
|
<div class='file'>
|
||||||
heroes
|
heroes
|
||||||
<aio-folder>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
hero
|
hero
|
||||||
<aio-file>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
hero.component.ts|html|css|spec.ts
|
hero.component.ts|html|css|spec.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
<aio-folder>
|
<div class='file'>
|
||||||
hero-list
|
hero-list
|
||||||
<aio-file>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
hero-list.component.ts|html|css|spec.ts
|
hero-list.component.ts|html|css|spec.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
<aio-folder>
|
<div class='file'>
|
||||||
shared
|
shared
|
||||||
<aio-file>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
hero-button.component.ts|html|css|spec.ts
|
hero-button.component.ts|html|css|spec.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
hero.model.ts
|
hero.model.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
hero.service.ts|spec.ts
|
hero.service.ts|spec.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
heroes.component.ts|html|css|spec.ts
|
heroes.component.ts|html|css|spec.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
heroes.module.ts
|
heroes.module.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
heroes-routing.module.ts
|
heroes-routing.module.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
<aio-folder>
|
<div class='file'>
|
||||||
shared
|
shared
|
||||||
<aio-file>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
shared.module.ts
|
shared.module.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
init-caps.pipe.ts|spec.ts
|
init-caps.pipe.ts|spec.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
text-filter.component.ts|spec.ts
|
text-filter.component.ts|spec.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
text-filter.service.ts|spec.ts
|
text-filter.service.ts|spec.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
<aio-folder>
|
<div class='file'>
|
||||||
villains
|
villains
|
||||||
<aio-folder>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
villain
|
villain
|
||||||
<aio-file>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
...
|
...
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
<aio-folder>
|
<div class='file'>
|
||||||
villain-list
|
villain-list
|
||||||
<aio-file>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
...
|
...
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
<aio-folder>
|
<div class='file'>
|
||||||
shared
|
shared
|
||||||
<aio-file>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
...
|
...
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
villains.component.ts|html|css|spec.ts
|
villains.component.ts|html|css|spec.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
villains.module.ts
|
villains.module.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
villains-routing.module.ts
|
villains-routing.module.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
app.component.ts|html|css|spec.ts
|
app.component.ts|html|css|spec.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
app.module.ts
|
app.module.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
app-routing.module.ts
|
app-routing.module.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
main.ts
|
main.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
index.html
|
index.html
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
...
|
...
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
node_modules/...
|
node_modules/...
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
...
|
...
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
</aio-filetree>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
@ -3081,61 +3133,73 @@ Yet there is a real danger of that happening if the `SharedModule` provides a se
|
|||||||
|
|
||||||
|
|
||||||
|
|
||||||
<aio-filetree>
|
<div class='filetree'>
|
||||||
|
|
||||||
<aio-folder>
|
<div class='file'>
|
||||||
src
|
src
|
||||||
<aio-folder>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
app
|
app
|
||||||
<aio-folder>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
shared
|
shared
|
||||||
<aio-file>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
shared.module.ts
|
shared.module.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
init-caps.pipe.ts|spec.ts
|
init-caps.pipe.ts|spec.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
text-filter.component.ts|spec.ts
|
text-filter.component.ts|spec.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
text-filter.service.ts|spec.ts
|
text-filter.service.ts|spec.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
app.component.ts|html|css|spec.ts
|
app.component.ts|html|css|spec.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
app.module.ts
|
app.module.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
app-routing.module.ts
|
app-routing.module.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
main.ts
|
main.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
index.html
|
index.html
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
...
|
...
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-filetree>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
@ -3353,73 +3417,93 @@ Yet there is a real danger of that happening accidentally if the `CoreModule` pr
|
|||||||
|
|
||||||
|
|
||||||
|
|
||||||
<aio-filetree>
|
<div class='filetree'>
|
||||||
|
|
||||||
<aio-folder>
|
<div class='file'>
|
||||||
src
|
src
|
||||||
<aio-folder>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
app
|
app
|
||||||
<aio-folder>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
core
|
core
|
||||||
<aio-file>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
core.module.ts
|
core.module.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
logger.service.ts|spec.ts
|
logger.service.ts|spec.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-folder>
|
<div class='file'>
|
||||||
nav
|
nav
|
||||||
<aio-file>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
nav.component.ts|html|css|spec.ts
|
nav.component.ts|html|css|spec.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
<aio-folder>
|
<div class='file'>
|
||||||
spinner
|
spinner
|
||||||
<aio-file>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
spinner.component.ts|html|css|spec.ts
|
spinner.component.ts|html|css|spec.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
spinner.service.ts|spec.ts
|
spinner.service.ts|spec.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
app.component.ts|html|css|spec.ts
|
app.component.ts|html|css|spec.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
app.module.ts
|
app.module.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
app-routing.module.ts
|
app-routing.module.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
main.ts
|
main.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
index.html
|
index.html
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
...
|
...
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-filetree>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|||||||
@ -1258,153 +1258,193 @@ and apply the steps as we go.
|
|||||||
In terms of project structure, this is where our work begins:
|
In terms of project structure, this is where our work begins:
|
||||||
|
|
||||||
|
|
||||||
<aio-filetree>
|
<div class='filetree'>
|
||||||
|
|
||||||
<aio-folder>
|
<div class='file'>
|
||||||
angular-phonecat
|
angular-phonecat
|
||||||
<aio-file>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
bower.json
|
bower.json
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
karma.conf.js
|
karma.conf.js
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
package.json
|
package.json
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-folder>
|
<div class='file'>
|
||||||
app
|
app
|
||||||
<aio-folder>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
core
|
core
|
||||||
<aio-folder>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
checkmark
|
checkmark
|
||||||
<aio-file>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
checkmark.filter.js
|
checkmark.filter.js
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
checkmark.filter.spec.js
|
checkmark.filter.spec.js
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
<aio-folder>
|
<div class='file'>
|
||||||
phone
|
phone
|
||||||
<aio-file>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
phone.module.js
|
phone.module.js
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
phone.service.js
|
phone.service.js
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
phone.service.spec.js
|
phone.service.spec.js
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
core.module.js
|
core.module.js
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
<aio-folder>
|
<div class='file'>
|
||||||
phone-detail
|
phone-detail
|
||||||
<aio-file>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
phone-detail.component.js
|
phone-detail.component.js
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
phone-detail.component.spec.js
|
phone-detail.component.spec.js
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
phone-detail.module.js
|
phone-detail.module.js
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
phone-detail.template.html
|
phone-detail.template.html
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
<aio-folder>
|
<div class='file'>
|
||||||
phone-list
|
phone-list
|
||||||
<aio-file>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
phone-list.component.js
|
phone-list.component.js
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
phone-list.component.spec.js
|
phone-list.component.spec.js
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
phone-list.module.js
|
phone-list.module.js
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
phone-list.template.html
|
phone-list.template.html
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
<aio-folder>
|
<div class='file'>
|
||||||
img
|
img
|
||||||
<aio-file>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
...
|
...
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
<aio-folder>
|
<div class='file'>
|
||||||
phones
|
phones
|
||||||
<aio-file>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
...
|
...
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
app.animations.js
|
app.animations.js
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
app.config.js
|
app.config.js
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
app.css
|
app.css
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
app.module.js
|
app.module.js
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
index.html
|
index.html
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
<aio-folder>
|
<div class='file'>
|
||||||
e2e-tests
|
e2e-tests
|
||||||
<aio-file>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
protractor-conf.js
|
protractor-conf.js
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
scenarios.js
|
scenarios.js
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
</aio-filetree>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|||||||
@ -14,57 +14,69 @@ named <code>angular-tour-of-heroes</code>.
|
|||||||
The file structure should look like this:
|
The file structure should look like this:
|
||||||
|
|
||||||
|
|
||||||
<aio-filetree>
|
<div class='filetree'>
|
||||||
|
|
||||||
<aio-folder>
|
<div class='file'>
|
||||||
angular-tour-of-heroes
|
angular-tour-of-heroes
|
||||||
<aio-folder>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
src
|
src
|
||||||
<aio-folder>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
app
|
app
|
||||||
<aio-file>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
app.component.ts
|
app.component.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
app.module.ts
|
app.module.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
main.ts
|
main.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
index.html
|
index.html
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
styles.css
|
styles.css
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
systemjs.config.js
|
systemjs.config.js
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
tsconfig.json
|
tsconfig.json
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
node_modules ...
|
node_modules ...
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
package.json
|
package.json
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
</aio-filetree>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|||||||
@ -20,57 +20,69 @@ verify that you have the following structure after [The Hero Editor](tutorial/to
|
|||||||
If your structure doesn't match, go back to that page to figure out what you missed.
|
If your structure doesn't match, go back to that page to figure out what you missed.
|
||||||
|
|
||||||
|
|
||||||
<aio-filetree>
|
<div class='filetree'>
|
||||||
|
|
||||||
<aio-folder>
|
<div class='file'>
|
||||||
angular-tour-of-heroes
|
angular-tour-of-heroes
|
||||||
<aio-folder>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
src
|
src
|
||||||
<aio-folder>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
app
|
app
|
||||||
<aio-file>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
app.component.ts
|
app.component.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
app.module.ts
|
app.module.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
main.ts
|
main.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
index.html
|
index.html
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
styles.css
|
styles.css
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
systemjs.config.js
|
systemjs.config.js
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
tsconfig.json
|
tsconfig.json
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
node_modules ...
|
node_modules ...
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
package.json
|
package.json
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
</aio-filetree>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|||||||
@ -26,57 +26,69 @@ Before getting started on this page, verify that you have the following structur
|
|||||||
If not, go back to the previous pages.
|
If not, go back to the previous pages.
|
||||||
|
|
||||||
|
|
||||||
<aio-filetree>
|
<div class='filetree'>
|
||||||
|
|
||||||
<aio-folder>
|
<div class='file'>
|
||||||
angular-tour-of-heroes
|
angular-tour-of-heroes
|
||||||
<aio-folder>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
src
|
src
|
||||||
<aio-folder>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
app
|
app
|
||||||
<aio-file>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
app.component.ts
|
app.component.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
app.module.ts
|
app.module.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
main.ts
|
main.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
index.html
|
index.html
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
styles.css
|
styles.css
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
systemjs.config.js
|
systemjs.config.js
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
tsconfig.json
|
tsconfig.json
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
node_modules ...
|
node_modules ...
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
package.json
|
package.json
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
</aio-filetree>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
@ -331,65 +343,77 @@ without touching the parent `AppComponent`.
|
|||||||
Verify that you have the following structure:
|
Verify that you have the following structure:
|
||||||
|
|
||||||
|
|
||||||
<aio-filetree>
|
<div class='filetree'>
|
||||||
|
|
||||||
<aio-folder>
|
<div class='file'>
|
||||||
angular-tour-of-heroes
|
angular-tour-of-heroes
|
||||||
<aio-folder>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
src
|
src
|
||||||
<aio-folder>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
app
|
app
|
||||||
<aio-file>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
app.component.ts
|
app.component.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
app.module.ts
|
app.module.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
hero.ts
|
hero.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
hero-detail.component.ts
|
hero-detail.component.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
main.ts
|
main.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
index.html
|
index.html
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
styles.css
|
styles.css
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
systemjs.config.js
|
systemjs.config.js
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
tsconfig.json
|
tsconfig.json
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
node_modules ...
|
node_modules ...
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
package.json
|
package.json
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
</aio-filetree>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|||||||
@ -27,65 +27,77 @@ Before continuing with the Tour of Heroes, verify that you have the following st
|
|||||||
If not, go back to the previous pages.
|
If not, go back to the previous pages.
|
||||||
|
|
||||||
|
|
||||||
<aio-filetree>
|
<div class='filetree'>
|
||||||
|
|
||||||
<aio-folder>
|
<div class='file'>
|
||||||
angular-tour-of-heroes
|
angular-tour-of-heroes
|
||||||
<aio-folder>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
src
|
src
|
||||||
<aio-folder>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
app
|
app
|
||||||
<aio-file>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
app.component.ts
|
app.component.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
app.module.ts
|
app.module.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
hero.ts
|
hero.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
hero-detail.component.ts
|
hero-detail.component.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
main.ts
|
main.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
index.html
|
index.html
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
styles.css
|
styles.css
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
systemjs.config.js
|
systemjs.config.js
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
tsconfig.json
|
tsconfig.json
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
node_modules ...
|
node_modules ...
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
package.json
|
package.json
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
</aio-filetree>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
@ -478,73 +490,85 @@ At the end of this page, [Appendix: take it slow](tutorial/toh-pt4#slow) describ
|
|||||||
Verify that you have the following structure after all of your refactoring:
|
Verify that you have the following structure after all of your refactoring:
|
||||||
|
|
||||||
|
|
||||||
<aio-filetree>
|
<div class='filetree'>
|
||||||
|
|
||||||
<aio-folder>
|
<div class='file'>
|
||||||
angular-tour-of-heroes
|
angular-tour-of-heroes
|
||||||
<aio-folder>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
src
|
src
|
||||||
<aio-folder>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
app
|
app
|
||||||
<aio-file>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
app.component.ts
|
app.component.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
app.module.ts
|
app.module.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
hero.ts
|
hero.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
hero-detail.component.ts
|
hero-detail.component.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
hero.service.ts
|
hero.service.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
mock-heroes.ts
|
mock-heroes.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
main.ts
|
main.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
index.html
|
index.html
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
styles.css
|
styles.css
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
systemjs.config.js
|
systemjs.config.js
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
tsconfig.json
|
tsconfig.json
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
node_modules ...
|
node_modules ...
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
package.json
|
package.json
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
</aio-filetree>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|||||||
@ -47,73 +47,85 @@ Before continuing with the Tour of Heroes, verify that you have the following st
|
|||||||
|
|
||||||
|
|
||||||
|
|
||||||
<aio-filetree>
|
<div class='filetree'>
|
||||||
|
|
||||||
<aio-folder>
|
<div class='file'>
|
||||||
angular-tour-of-heroes
|
angular-tour-of-heroes
|
||||||
<aio-folder>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
src
|
src
|
||||||
<aio-folder>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
app
|
app
|
||||||
<aio-file>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
app.component.ts
|
app.component.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
app.module.ts
|
app.module.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
hero.service.ts
|
hero.service.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
hero.ts
|
hero.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
hero-detail.component.ts
|
hero-detail.component.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
mock-heroes.ts
|
mock-heroes.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
main.ts
|
main.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
index.html
|
index.html
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
styles.css
|
styles.css
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
systemjs.config.js
|
systemjs.config.js
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
tsconfig.json
|
tsconfig.json
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
node_modules ...
|
node_modules ...
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
package.json
|
package.json
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
</aio-filetree>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
@ -1223,113 +1235,125 @@ Review the sample source code in the <live-example></live-example> for this page
|
|||||||
Verify that you have the following structure:
|
Verify that you have the following structure:
|
||||||
|
|
||||||
|
|
||||||
<aio-filetree>
|
<div class='filetree'>
|
||||||
|
|
||||||
<aio-folder>
|
<div class='file'>
|
||||||
angular-tour-of-heroes
|
angular-tour-of-heroes
|
||||||
<aio-folder>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
src
|
src
|
||||||
<aio-folder>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
app
|
app
|
||||||
<aio-file>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
app.component.css
|
app.component.css
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
app.component.ts
|
app.component.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
app.module.ts
|
app.module.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
app-routing.module.ts
|
app-routing.module.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
dashboard.component.css
|
dashboard.component.css
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
dashboard.component.html
|
dashboard.component.html
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
dashboard.component.ts
|
dashboard.component.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
hero.service.ts
|
hero.service.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
hero.ts
|
hero.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
hero-detail.component.css
|
hero-detail.component.css
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
hero-detail.component.html
|
hero-detail.component.html
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
hero-detail.component.ts
|
hero-detail.component.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
heroes.component.css
|
heroes.component.css
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
heroes.component.html
|
heroes.component.html
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
heroes.component.ts
|
heroes.component.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
mock-heroes.ts
|
mock-heroes.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
main.ts
|
main.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
index.html
|
index.html
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
styles.css
|
styles.css
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
systemjs.config.js
|
systemjs.config.js
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
tsconfig.json
|
tsconfig.json
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
node_modules ...
|
node_modules ...
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
package.json
|
package.json
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
</aio-filetree>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|||||||
@ -711,129 +711,141 @@ Review the sample source code in the <live-example></live-example> for this page
|
|||||||
Verify that you have the following structure:
|
Verify that you have the following structure:
|
||||||
|
|
||||||
|
|
||||||
<aio-filetree>
|
<div class='filetree'>
|
||||||
|
|
||||||
<aio-folder>
|
<div class='file'>
|
||||||
angular-tour-of-heroes
|
angular-tour-of-heroes
|
||||||
<aio-folder>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
src
|
src
|
||||||
<aio-folder>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
app
|
app
|
||||||
<aio-file>
|
</div>
|
||||||
|
|
||||||
|
<div class='children'>
|
||||||
|
|
||||||
|
<div class='file'>
|
||||||
app.component.ts
|
app.component.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
app.component.css
|
app.component.css
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
app.module.ts
|
app.module.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
app-routing.module.ts
|
app-routing.module.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
dashboard.component.css
|
dashboard.component.css
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
dashboard.component.html
|
dashboard.component.html
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
dashboard.component.ts
|
dashboard.component.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
hero.ts
|
hero.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
hero-detail.component.css
|
hero-detail.component.css
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
hero-detail.component.html
|
hero-detail.component.html
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
hero-detail.component.ts
|
hero-detail.component.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
hero-search.component.html (new)
|
hero-search.component.html (new)
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
hero-search.component.css (new)
|
hero-search.component.css (new)
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
hero-search.component.ts (new)
|
hero-search.component.ts (new)
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
hero-search.service.ts (new)
|
hero-search.service.ts (new)
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
hero.service.ts
|
hero.service.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
heroes.component.css
|
heroes.component.css
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
heroes.component.html
|
heroes.component.html
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
heroes.component.ts
|
heroes.component.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
in-memory-data.service.ts (new)
|
in-memory-data.service.ts (new)
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
main.ts
|
main.ts
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
index.html
|
index.html
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
styles.css
|
styles.css
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
systemjs.config.js
|
systemjs.config.js
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
tsconfig.json
|
tsconfig.json
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
node_modules ...
|
node_modules ...
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
<aio-file>
|
<div class='file'>
|
||||||
package.json
|
package.json
|
||||||
</aio-file>
|
</div>
|
||||||
|
|
||||||
</aio-folder>
|
</div>
|
||||||
|
|
||||||
</aio-filetree>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user