Merge remote-tracking branch 'remotes/angular.io/master'
# Conflicts: # public/docs/ts/latest/_data.json # public/docs/ts/latest/glossary.jade
This commit is contained in:
@@ -11,12 +11,12 @@
|
||||
<script src="node_modules/reflect-metadata/Reflect.js"></script>
|
||||
|
||||
<script src="node_modules/rxjs/bundles/Rx.umd.js"></script>
|
||||
<script src="node_modules/@angular/core/core.umd.js"></script>
|
||||
<script src="node_modules/@angular/common/common.umd.js"></script>
|
||||
<script src="node_modules/@angular/compiler/compiler.umd.js"></script>
|
||||
<script src="node_modules/@angular/platform-browser/platform-browser.umd.js"></script>
|
||||
<script src="node_modules/@angular/platform-browser-dynamic/platform-browser-dynamic.umd.js"></script>
|
||||
<script src="node_modules/@angular/router-deprecated/router-deprecated.umd.js"></script>
|
||||
<script src="node_modules/@angular/core/bundles/core.umd.js"></script>
|
||||
<script src="node_modules/@angular/common/bundles/common.umd.js"></script>
|
||||
<script src="node_modules/@angular/compiler/bundles/compiler.umd.js"></script>
|
||||
<script src="node_modules/@angular/platform-browser/bundles/platform-browser.umd.js"></script>
|
||||
<script src="node_modules/@angular/platform-browser-dynamic/bundles/platform-browser-dynamic.umd.js"></script>
|
||||
<script src="node_modules/@angular/router-deprecated/bundles/router-deprecated.umd.js"></script>
|
||||
|
||||
<script src="app/data.service.js"></script>
|
||||
<script src="app/hero.component.js"></script>
|
||||
|
||||
@@ -21,11 +21,11 @@
|
||||
<script src="node_modules/reflect-metadata/Reflect.js"></script>
|
||||
|
||||
<script src="node_modules/rxjs/bundles/Rx.umd.js"></script>
|
||||
<script src="node_modules/@angular/core/core.umd.js"></script>
|
||||
<script src="node_modules/@angular/common/common.umd.js"></script>
|
||||
<script src="node_modules/@angular/compiler/compiler.umd.js"></script>
|
||||
<script src="node_modules/@angular/platform-browser/platform-browser.umd.js"></script>
|
||||
<script src="node_modules/@angular/platform-browser-dynamic/platform-browser-dynamic.umd.js"></script>
|
||||
<script src="node_modules/@angular/core/bundles/core.umd.js"></script>
|
||||
<script src="node_modules/@angular/common/bundles/common.umd.js"></script>
|
||||
<script src="node_modules/@angular/compiler/bundles/compiler.umd.js"></script>
|
||||
<script src="node_modules/@angular/platform-browser/bundles/platform-browser.umd.js"></script>
|
||||
<script src="node_modules/@angular/platform-browser-dynamic/bundles/platform-browser-dynamic.umd.js"></script>
|
||||
|
||||
<!-- #docregion scripts-hero, scripts-hero-form -->
|
||||
<script src='app/hero.js'></script>
|
||||
|
||||
@@ -74,15 +74,15 @@ describe('Lifecycle hooks', function () {
|
||||
expect(titleEle.getText()).toContain('Windstorm-foo- can sing');
|
||||
return changeLogEles.count();
|
||||
}).then(function (count) {
|
||||
// two more for each keystroke except the 1st
|
||||
expect(count).toEqual(logCount + 9, 'should add 9 more messages');
|
||||
// one more for each keystroke
|
||||
expect(count).toEqual(logCount + 5, 'should add 5 more messages');
|
||||
logCount = count;
|
||||
// return powerInputEle.sendKeys('-bar-');
|
||||
return sendKeys(powerInputEle, '-bar-');
|
||||
}).then(function () {
|
||||
expect(titleEle.getText()).toContain('Windstorm-foo- can sing-bar-');
|
||||
// 7 == 2 previously + length of '-bar-'
|
||||
expect(changeLogEles.count()).toEqual(logCount + 15, 'should add 15 more messages');
|
||||
expect(changeLogEles.count()).toEqual(logCount + 11, 'should add 11 more messages');
|
||||
});
|
||||
});
|
||||
|
||||
@@ -106,7 +106,7 @@ describe('Lifecycle hooks', function () {
|
||||
expect(commentEle.getText()).toContain('long name');
|
||||
return logEles.count();
|
||||
}).then(function(count) {
|
||||
expect(logCount + 10).toEqual(count, '10 additional log messages should have been added');
|
||||
expect(logCount + 6).toEqual(count, '6 additional log messages should have been added');
|
||||
logCount = count;
|
||||
return buttonEle.click();
|
||||
}).then(function() {
|
||||
@@ -135,7 +135,7 @@ describe('Lifecycle hooks', function () {
|
||||
expect(commentEle.getText()).toContain('long name');
|
||||
return logEles.count();
|
||||
}).then(function(count) {
|
||||
expect(logCount + 10).toEqual(count, '10 additional log messages should have been added');
|
||||
expect(logCount + 5).toEqual(count, '5 additional log messages should have been added');
|
||||
logCount = count;
|
||||
return buttonEle.click();
|
||||
}).then(function() {
|
||||
|
||||
@@ -25,22 +25,22 @@
|
||||
"author": "",
|
||||
"license": "ISC",
|
||||
"dependencies": {
|
||||
"@angular/common": "2.0.0-rc.1",
|
||||
"@angular/compiler": "2.0.0-rc.1",
|
||||
"@angular/core": "2.0.0-rc.1",
|
||||
"@angular/http": "2.0.0-rc.1",
|
||||
"@angular/platform-browser": "2.0.0-rc.1",
|
||||
"@angular/platform-browser-dynamic": "2.0.0-rc.1",
|
||||
"@angular/router": "2.0.0-rc.1",
|
||||
"@angular/router-deprecated": "2.0.0-rc.1",
|
||||
"@angular/upgrade": "2.0.0-rc.1",
|
||||
"systemjs": "0.19.27",
|
||||
"@angular/common": "2.0.0-rc.2",
|
||||
"@angular/compiler": "2.0.0-rc.2",
|
||||
"@angular/core": "2.0.0-rc.2",
|
||||
"@angular/http": "2.0.0-rc.2",
|
||||
"@angular/platform-browser": "2.0.0-rc.2",
|
||||
"@angular/platform-browser-dynamic": "2.0.0-rc.2",
|
||||
"@angular/router": "2.0.0-rc.2",
|
||||
"@angular/router-deprecated": "2.0.0-rc.2",
|
||||
"@angular/upgrade": "2.0.0-rc.2",
|
||||
"angular2-in-memory-web-api": "0.0.11",
|
||||
"bootstrap": "^3.3.6",
|
||||
"core-js": "^2.4.0",
|
||||
"reflect-metadata": "^0.1.3",
|
||||
"rxjs": "5.0.0-beta.6",
|
||||
"zone.js": "^0.6.12",
|
||||
"angular2-in-memory-web-api": "0.0.11",
|
||||
"bootstrap": "^3.3.6"
|
||||
"systemjs": "0.19.27",
|
||||
"zone.js": "^0.6.12"
|
||||
},
|
||||
"devDependencies": {
|
||||
"angular-cli": "^1.0.0-beta.5",
|
||||
|
||||
@@ -17,11 +17,11 @@
|
||||
<script src="node_modules/reflect-metadata/Reflect.js"></script>
|
||||
|
||||
<script src="node_modules/rxjs/bundles/Rx.umd.js"></script>
|
||||
<script src="node_modules/@angular/core/core.umd.js"></script>
|
||||
<script src="node_modules/@angular/common/common.umd.js"></script>
|
||||
<script src="node_modules/@angular/compiler/compiler.umd.js"></script>
|
||||
<script src="node_modules/@angular/platform-browser/platform-browser.umd.js"></script>
|
||||
<script src="node_modules/@angular/platform-browser-dynamic/platform-browser-dynamic.umd.js"></script>
|
||||
<script src="node_modules/@angular/core/bundles/core.umd.js"></script>
|
||||
<script src="node_modules/@angular/common/bundles/common.umd.js"></script>
|
||||
<script src="node_modules/@angular/compiler/bundles/compiler.umd.js"></script>
|
||||
<script src="node_modules/@angular/platform-browser/bundles/platform-browser.umd.js"></script>
|
||||
<script src="node_modules/@angular/platform-browser-dynamic/bundles/platform-browser-dynamic.umd.js"></script>
|
||||
<!-- #enddocregion libraries -->
|
||||
|
||||
<!-- 2. Load our 'modules' -->
|
||||
|
||||
@@ -7,15 +7,15 @@
|
||||
},
|
||||
"license": "ISC",
|
||||
"dependencies": {
|
||||
"@angular/common": "2.0.0-rc.1",
|
||||
"@angular/compiler": "2.0.0-rc.1",
|
||||
"@angular/core": "2.0.0-rc.1",
|
||||
"@angular/http": "2.0.0-rc.1",
|
||||
"@angular/platform-browser": "2.0.0-rc.1",
|
||||
"@angular/platform-browser-dynamic": "2.0.0-rc.1",
|
||||
"@angular/router": "2.0.0-rc.1",
|
||||
"@angular/router-deprecated": "2.0.0-rc.1",
|
||||
"@angular/upgrade": "2.0.0-rc.1",
|
||||
"@angular/common": "2.0.0-rc.2",
|
||||
"@angular/compiler": "2.0.0-rc.2",
|
||||
"@angular/core": "2.0.0-rc.2",
|
||||
"@angular/http": "2.0.0-rc.2",
|
||||
"@angular/platform-browser": "2.0.0-rc.2",
|
||||
"@angular/platform-browser-dynamic": "2.0.0-rc.2",
|
||||
"@angular/router": "2.0.0-rc.2",
|
||||
"@angular/router-deprecated": "2.0.0-rc.2",
|
||||
"@angular/upgrade": "2.0.0-rc.2",
|
||||
|
||||
"core-js": "^2.4.0",
|
||||
"reflect-metadata": "0.1.3",
|
||||
|
||||
@@ -11,15 +11,15 @@
|
||||
},
|
||||
"license": "ISC",
|
||||
"dependencies": {
|
||||
"@angular/common": "2.0.0-rc.1",
|
||||
"@angular/compiler": "2.0.0-rc.1",
|
||||
"@angular/core": "2.0.0-rc.1",
|
||||
"@angular/http": "2.0.0-rc.1",
|
||||
"@angular/platform-browser": "2.0.0-rc.1",
|
||||
"@angular/platform-browser-dynamic": "2.0.0-rc.1",
|
||||
"@angular/router": "2.0.0-rc.1",
|
||||
"@angular/router-deprecated": "2.0.0-rc.1",
|
||||
"@angular/upgrade": "2.0.0-rc.1",
|
||||
"@angular/common": "2.0.0-rc.2",
|
||||
"@angular/compiler": "2.0.0-rc.2",
|
||||
"@angular/core": "2.0.0-rc.2",
|
||||
"@angular/http": "2.0.0-rc.2",
|
||||
"@angular/platform-browser": "2.0.0-rc.2",
|
||||
"@angular/platform-browser-dynamic": "2.0.0-rc.2",
|
||||
"@angular/router": "2.0.0-rc.2",
|
||||
"@angular/router-deprecated": "2.0.0-rc.2",
|
||||
"@angular/upgrade": "2.0.0-rc.2",
|
||||
|
||||
"systemjs": "0.19.27",
|
||||
"core-js": "^2.4.0",
|
||||
|
||||
@@ -11,11 +11,11 @@
|
||||
<script src="node_modules/reflect-metadata/Reflect.js"></script>
|
||||
|
||||
<script src="node_modules/rxjs/bundles/Rx.umd.js"></script>
|
||||
<script src="node_modules/@angular/core/core.umd.js"></script>
|
||||
<script src="node_modules/@angular/common/common.umd.js"></script>
|
||||
<script src="node_modules/@angular/compiler/compiler.umd.js"></script>
|
||||
<script src="node_modules/@angular/platform-browser/platform-browser.umd.js"></script>
|
||||
<script src="node_modules/@angular/platform-browser-dynamic/platform-browser-dynamic.umd.js"></script>
|
||||
<script src="node_modules/@angular/core/bundles/core.umd.js"></script>
|
||||
<script src="node_modules/@angular/common/bundles/common.umd.js"></script>
|
||||
<script src="node_modules/@angular/compiler/bundles/compiler.umd.js"></script>
|
||||
<script src="node_modules/@angular/platform-browser/bundles/platform-browser.umd.js"></script>
|
||||
<script src="node_modules/@angular/platform-browser-dynamic/bundles/platform-browser-dynamic.umd.js"></script>
|
||||
|
||||
<script src='app.js'></script>
|
||||
</head>
|
||||
|
||||
@@ -39,7 +39,7 @@
|
||||
|
||||
// Bundled (~40 requests):
|
||||
function packUmd(pkgName) {
|
||||
packages['@angular/'+pkgName] = { main: pkgName + '.umd.js', defaultExtension: 'js' };
|
||||
packages['@angular/'+pkgName] = { main: '/bundles/' + pkgName + '.umd.js', defaultExtension: 'js' };
|
||||
}
|
||||
|
||||
// Most environments should use UMD; some (Karma) need the individual index files
|
||||
|
||||
@@ -5,7 +5,7 @@
|
||||
*/
|
||||
(function(global) {
|
||||
|
||||
var ngVer = '@2.0.0-rc.1'; // lock in the angular package version; do not let it float to current!
|
||||
var ngVer = '@2.0.0-rc.2'; // lock in the angular package version; do not let it float to current!
|
||||
|
||||
//map tells the System loader where to look for things
|
||||
var map = {
|
||||
@@ -47,7 +47,7 @@
|
||||
ngPackageNames.forEach(function(pkgName) {
|
||||
|
||||
// Bundled (~40 requests):
|
||||
packages['@angular/'+pkgName] = { main: pkgName + '.umd.js', defaultExtension: 'js' };
|
||||
packages['@angular/'+pkgName] = { main: '/bundles/' + pkgName + '.umd.js', defaultExtension: 'js' };
|
||||
|
||||
// Individual files (~300 requests):
|
||||
//packages['@angular/'+pkgName] = { main: 'index.js', defaultExtension: 'js' };
|
||||
|
||||
@@ -585,7 +585,7 @@ bindon-ngModel
|
||||
</div>
|
||||
|
||||
<p>with trackBy and <i>space</i> separator</p>
|
||||
<div #withTrackBy class="box">
|
||||
<div class="box">
|
||||
<div *ngFor="let hero of heroes trackBy:trackByHeroes">({{hero.id}}) {{hero.fullName}}</div>
|
||||
</div>
|
||||
|
||||
|
||||
@@ -10,7 +10,7 @@ import 'hero_detail_component.dart';
|
||||
|
||||
@Component(
|
||||
selector: 'my-app',
|
||||
// #docregion hero-detail-template
|
||||
// #docregion hero-detail-template
|
||||
template: '''
|
||||
<h1>{{title}}</h1>
|
||||
<h2>My Heroes</h2>
|
||||
@@ -23,8 +23,9 @@ import 'hero_detail_component.dart';
|
||||
</ul>
|
||||
<my-hero-detail [hero]="selectedHero"></my-hero-detail>
|
||||
''',
|
||||
// #enddocregion hero-detail-template
|
||||
styles: const ['''
|
||||
// #enddocregion hero-detail-template
|
||||
styles: const [
|
||||
'''
|
||||
.selected {
|
||||
background-color: #CFD8DC !important;
|
||||
color: white;
|
||||
@@ -73,17 +74,16 @@ import 'hero_detail_component.dart';
|
||||
}
|
||||
'''
|
||||
],
|
||||
// #docregion directives
|
||||
directives: const [
|
||||
HeroDetailComponent
|
||||
])
|
||||
// #enddocregion directives
|
||||
// #docregion directives
|
||||
directives: const [HeroDetailComponent]
|
||||
// #enddocregion directives
|
||||
)
|
||||
class AppComponent {
|
||||
final String title = 'Tour of Heroes';
|
||||
final List<Hero> heroes = mockHeroes;
|
||||
Hero selectedHero;
|
||||
|
||||
onSelect(Hero hero) {
|
||||
void onSelect(Hero hero) {
|
||||
selectedHero = hero;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -5,4 +5,3 @@ class Hero {
|
||||
|
||||
Hero(this.id, this.name);
|
||||
}
|
||||
// #enddocregion
|
||||
|
||||
@@ -11,29 +11,26 @@ import 'hero.dart';
|
||||
// #docregion v1
|
||||
@Component(
|
||||
selector: 'my-hero-detail',
|
||||
// #enddocregion v1
|
||||
// #enddocregion v1
|
||||
// #docregion template
|
||||
template: '''
|
||||
<div *ngIf="hero != null">
|
||||
<h2>{{hero.name}} details!</h2>
|
||||
<div><label>id: </label>{{hero.id}}</div>
|
||||
<div>
|
||||
<label>name: </label>
|
||||
<input [(ngModel)]="hero.name" placeholder="name">
|
||||
</div>
|
||||
</div>
|
||||
'''
|
||||
<div *ngIf="hero != null">
|
||||
<h2>{{hero.name}} details!</h2>
|
||||
<div><label>id: </label>{{hero.id}}</div>
|
||||
<div>
|
||||
<label>name: </label>
|
||||
<input [(ngModel)]="hero.name" placeholder="name">
|
||||
</div>
|
||||
</div>'''
|
||||
// #enddocregion template
|
||||
// #docregion v1
|
||||
// #docregion v1
|
||||
)
|
||||
class HeroDetailComponent {
|
||||
// #enddocregion v1
|
||||
// #docregion inputs
|
||||
// #enddocregion v1
|
||||
// #docregion inputs
|
||||
@Input()
|
||||
// #docregion hero
|
||||
// #docregion hero
|
||||
Hero hero;
|
||||
// #enddocregion hero
|
||||
// #enddocregion inputs
|
||||
// #docregion v1
|
||||
// #enddocregion hero, inputs
|
||||
// #docregion v1
|
||||
}
|
||||
// #enddocregion v1
|
||||
|
||||
@@ -40,8 +40,8 @@
|
||||
|
||||
// Bundled (~40 requests):
|
||||
function packUmd(pkgName) {
|
||||
packages['@angular/'+pkgName] = { main: pkgName + '.umd.js', defaultExtension: 'js' };
|
||||
};
|
||||
packages['@angular/'+pkgName] = { main: '/bundles/' + pkgName + '.umd.js', defaultExtension: 'js' };
|
||||
}
|
||||
|
||||
var setPackageConfig = System.packageWithIndex ? packIndex : packUmd;
|
||||
|
||||
|
||||
@@ -40,8 +40,8 @@
|
||||
|
||||
// Bundled (~40 requests):
|
||||
function packUmd(pkgName) {
|
||||
packages['@angular/'+pkgName] = { main: pkgName + '.umd.js', defaultExtension: 'js' };
|
||||
};
|
||||
packages['@angular/'+pkgName] = { main: '/bundles/' + pkgName + '.umd.js', defaultExtension: 'js' };
|
||||
}
|
||||
|
||||
var setPackageConfig = System.packageWithIndex ? packIndex : packUmd;
|
||||
|
||||
|
||||
@@ -12,7 +12,19 @@ include _util-fns
|
||||
!=partial('../../ts/latest/_fragments/glossary-f-l')
|
||||
!=partial('../../ts/latest/_fragments/glossary-m1')
|
||||
//!=partial('../../ts/latest/_fragments/glossary-m2') not needed in dart
|
||||
!=partial('../../ts/latest/_fragments/glossary-n-s')
|
||||
!=partial('../../ts/latest/_fragments/glossary-n-s-1')
|
||||
|
||||
:marked
|
||||
## snake_case
|
||||
.l-sub-section
|
||||
:marked
|
||||
The practice of writing compound words or phrases such that each word is separated by an underscore (`_`).
|
||||
|
||||
Library and file names are often spelled in snake_case. Examples include: `angular2_tour_of_heroes` and `app_component.dart`.
|
||||
|
||||
This form is also known as **underscore case**.
|
||||
|
||||
!=partial('../../ts/latest/_fragments/glossary-n-s-2')
|
||||
!=partial('../../ts/latest/_fragments/glossary-t1')
|
||||
//!=partial('../../ts/latest/_fragments/glossary-t2') notneeded in dart
|
||||
!=partial('../../ts/latest/_fragments/glossary-u-z')
|
||||
|
||||
@@ -26,10 +26,9 @@ include ../_util-fns
|
||||
.children
|
||||
.file index.html
|
||||
.file main.dart
|
||||
.file styles.css
|
||||
.file pubspec.yaml
|
||||
|
||||
// Add .file styles.css
|
||||
|
||||
.p
|
||||
|
||||
.callout.is-helpful
|
||||
|
||||
@@ -29,6 +29,7 @@ p Run the #[+liveExampleLink2('', 'toh-2')] for this part.
|
||||
.children
|
||||
.file index.html
|
||||
.file main.dart
|
||||
.file styles.css
|
||||
.file pubspec.yaml
|
||||
:marked
|
||||
### Keep the app compiling and running
|
||||
|
||||
@@ -21,12 +21,13 @@ p Run the #[+liveExampleLink2('', 'toh-3')] for this part.
|
||||
.children
|
||||
.file index.html
|
||||
.file main.dart
|
||||
.file styles.css
|
||||
.file pubspec.yaml
|
||||
:marked
|
||||
### Keep the app compiling and running
|
||||
We want to start the Dart compiler, have it watch for changes, and start our server. We'll do this by typing
|
||||
|
||||
code-example(format="." language="bash").
|
||||
code-example(language="bash").
|
||||
pub serve
|
||||
|
||||
:marked
|
||||
@@ -50,7 +51,7 @@ code-example(format="." language="bash").
|
||||
### Separating the Hero Detail Component
|
||||
Add a new file named `hero_detail_component.dart` to the `lib` folder and create `HeroDetailComponent` as follows.
|
||||
|
||||
+makeExample('toh-3/dart/lib/hero_detail_component.dart', 'v1', 'hero_detail_component.dart (initial version)')(format=".")
|
||||
+makeExample('toh-3/dart/lib/hero_detail_component.dart', 'v1', 'lib/hero_detail_component.dart (initial version)')(format=".")
|
||||
.l-sub-section
|
||||
:marked
|
||||
### Naming conventions
|
||||
@@ -61,7 +62,8 @@ code-example(format="." language="bash").
|
||||
|
||||
All of our component names end in "Component". All of our component file names end in "_component".
|
||||
|
||||
We spell our filenames in lower underscore case (AKA "snake_case") so we don't worry about
|
||||
We spell our filenames in lower **underscore case**
|
||||
(AKA **[snake_case](../guide/glossary.html#!#snake_case)**) so we don't worry about
|
||||
case sensitivity on the server or in source control.
|
||||
|
||||
<!-- TODO
|
||||
@@ -89,26 +91,26 @@ code-example(format="." language="bash").
|
||||
So we replace `selectedHero` with `hero` everywhere in our new template. That's our only change.
|
||||
The result looks like this:
|
||||
|
||||
+makeExample('toh-3/dart/lib/hero_detail_component.dart', 'template', 'hero_detail_component.dart (template)')(format=".")
|
||||
+makeExample('toh-3/dart/lib/hero_detail_component.dart', 'template', 'lib/hero_detail_component.dart (template)')(format=".")
|
||||
|
||||
:marked
|
||||
Now our hero detail layout exists only in the `HeroDetailComponent`.
|
||||
|
||||
#### Add the *hero* property
|
||||
Let’s add that `hero` property we were talking about to the component class.
|
||||
+makeExample('toh-3/dart/lib/hero_detail_component.dart', 'hero')(format=".")
|
||||
+makeExample('toh-3/dart/lib/hero_detail_component.dart', 'hero')
|
||||
:marked
|
||||
Uh oh. We declared the `hero` property as type `Hero` but our `Hero` class is over in the `app_component.dart` file.
|
||||
We have two components, each in their own file, that need to reference the `Hero` class.
|
||||
|
||||
We solve the problem by relocating the `Hero` class from `app_component.dart` to its own `hero.dart` file.
|
||||
|
||||
+makeExample('toh-3/dart/lib/hero.dart', null, 'hero.dart (Exported Hero class)')(format=".")
|
||||
+makeExample('toh-3/dart/lib/hero.dart', '', 'lib/hero.dart')(format=".")
|
||||
|
||||
:marked
|
||||
Add the following import statement near the top of both `app_component.dart` and `hero_detail_component.dart`.
|
||||
Add the following import statement near the top of **both `app_component.dart` and `hero_detail_component.dart`**.
|
||||
|
||||
+makeExample('toh-3/dart/lib/hero_detail_component.dart', 'hero-import', 'hero_detail_component.dart and app_component.dart (Import the Hero class)')(format=".")
|
||||
+makeExample('toh-3/dart/lib/hero_detail_component.dart', 'hero-import')
|
||||
|
||||
:marked
|
||||
#### The *hero* property is an ***input***
|
||||
@@ -167,7 +169,7 @@ code-example(format=".")
|
||||
:marked
|
||||
The `AppComponent`’s template should now look like this
|
||||
|
||||
+makeExample('toh-3/dart/lib/app_component.dart', 'hero-detail-template', 'app_component.dart (Template)')(format=".")
|
||||
+makeExample('toh-3/dart/lib/app_component.dart', 'hero-detail-template', 'app_component.dart (template)')(format=".")
|
||||
:marked
|
||||
Thanks to the binding, the `HeroDetailComponent` should receive the hero from the `AppComponent` and display that hero's detail beneath the list.
|
||||
The detail should update every time the user picks a new hero.
|
||||
@@ -213,6 +215,7 @@ code-example(format=".")
|
||||
.children
|
||||
.file index.html
|
||||
.file main.dart
|
||||
.file styles.css
|
||||
.file pubspec.yaml
|
||||
:marked
|
||||
Here are the code files we discussed in this chapter.
|
||||
@@ -237,6 +240,8 @@ code-example(format=".")
|
||||
* We learned to bind a parent component to a child component.
|
||||
* We learned to declare the application directives we need in a `directives` list.
|
||||
|
||||
p Run the #[+liveExampleLink2('', 'toh-3')] for this part.
|
||||
|
||||
.l-main-section
|
||||
:marked
|
||||
## The Road Ahead
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
"icon": "home",
|
||||
"title": "Angular Docs",
|
||||
"menuTitle": "Docs Home",
|
||||
"banner": "Welcome to <b>Angular in JavaScript</b>! The current Angular 2 release is <b>rc.1</b>. Please consult the <a href='https://github.com/angular/angular/blob/master/CHANGELOG.md' target='_blank'> Change Log</a> about recent enhancements, fixes, and breaking changes."
|
||||
"banner": "Welcome to <b>Angular in JavaScript</b>! The current Angular 2 release is <b>rc.2</b>. Please consult the <a href='https://github.com/angular/angular/blob/master/CHANGELOG.md' target='_blank'> Change Log</a> about recent enhancements, fixes, and breaking changes."
|
||||
},
|
||||
|
||||
"quickstart": {
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
"icon": "home",
|
||||
"title": "Angular文档",
|
||||
"menuTitle": "文档首页",
|
||||
"banner": "欢迎来到 <b>Angular in TypeScript</b>! 当前的Angular版本是 <b>rc.1</b>。请参考<a href='https://github.com/angular/angular/blob/master/CHANGELOG.md' target='_blank'>变更记录</a>。"
|
||||
"banner": "欢迎来到 <b>Angular in TypeScript</b>! 当前的Angular版本是 <b>rc.2</b>。请参考<a href='https://github.com/angular/angular/blob/master/CHANGELOG.md' target='_blank'>变更记录</a>,以及最新功能,修复和重大打破性变化。"
|
||||
},
|
||||
|
||||
"cli-quickstart": {
|
||||
|
||||
+133
-132
File diff suppressed because it is too large
Load Diff
Reference in New Issue
Block a user