Skip to content
This repository was archived by the owner on Dec 4, 2017. It is now read-only.

docs(lifecycle-hooks): post-RC5 Dart resync #2141

Merged
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ import 'logger_service.dart';
//////////////////
// #docregion child-view
@Component(
selector: 'my-child',
selector: 'my-child-view',
template: '<input [(ngModel)]="hero">')
class ChildViewComponent {
String hero = 'Magneta';
Expand All @@ -20,7 +20,7 @@ class ChildViewComponent {
// #docregion template
template: '''
<div>-- child view begins --</div>
<my-child></my-child>
<my-child-view></my-child-view>
<div>-- child view ends --</div>
<p *ngIf="comment.isNotEmpty" class="comment">{{comment}}</p>''',
// #enddocregion template
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -92,7 +92,7 @@ class DoCheckComponent implements DoCheck, OnChanges {

@Component(
selector: 'do-check-parent',
templateUrl: 'on_changes_parent_component.html',
templateUrl: 'do_check_parent_component.html',
styles: const ['.parent {background: Lavender}'],
directives: const [DoCheckComponent])
class DoCheckParentComponent {
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,13 @@
<div class="parent">
<h2>{{title}}</h2>

<table>
<tr><td>Power: </td><td><input [(ngModel)]="power"></td></tr>
<tr><td>Hero.name: </td><td><input [(ngModel)]="hero.name"></td></tr>
</table>
<p><button (click)="reset()">Reset Log</button></p>

<!-- #docregion do-check -->
<do-check [hero]="hero" [power]="power"></do-check>
<!-- #enddocregion do-check -->
</div>
Original file line number Diff line number Diff line change
Expand Up @@ -10,5 +10,4 @@ <h2>{{title}}</h2>
<!-- #docregion on-changes -->
<on-changes [hero]="hero" [power]="power"></on-changes>
<!-- #enddocregion on-changes -->
<do-check [hero]="hero" [power]="power"></do-check>
</div>
4 changes: 1 addition & 3 deletions public/docs/_examples/lifecycle-hooks/dart/web/main.dart
Original file line number Diff line number Diff line change
@@ -1,8 +1,6 @@
// #docregion
import 'package:angular2/platform/browser.dart';

import 'package:lifecycle_hooks/app_component.dart';

main() {
void main() {
bootstrap(AppComponent);
}
1 change: 0 additions & 1 deletion public/docs/_examples/lifecycle-hooks/ts/app/main.ts
Original file line number Diff line number Diff line change
@@ -1,4 +1,3 @@
// #docregion
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { AppModule } from './app.module';

Expand Down
Whitespace-only changes.
13 changes: 10 additions & 3 deletions public/docs/dart/latest/guide/lifecycle-hooks.jade
Original file line number Diff line number Diff line change
Expand Up @@ -3,9 +3,16 @@ extends ../../../ts/_cache/guide/lifecycle-hooks.jade
block includes
include ../_util-fns

block optional-interfaces
//- n/a for Dart
block other-angular-subsystems
:marked
The router, for instance, also has its own [router lifecycle
hooks](router.html#router-lifecycle-hooks) that allow us to tap into
specific moments in route navigation.
A parallel can be drawn between `ngOnInit` and `routerOnActivate`. Both are
prefixed so as to avoid collision, and both run right when a component is
being initialized.

block tick-methods
:marked
The `LoggerService.tick` method, which returns a `Future`, postpones the update one turn of the of the browser's update cycle ... and that's long enough.
The `LoggerService.tick` method, which returns a `Future`, postpones the
update one turn of the of the browser's update cycle ... and that's long enough.
13 changes: 7 additions & 6 deletions public/docs/ts/_cache/guide/lifecycle-hooks.jade
Original file line number Diff line number Diff line change
Expand Up @@ -43,10 +43,12 @@ a#hooks-overview
:marked
No directive or component will implement all of them and some of the hooks only make sense for components.
Angular only calls a directive/component hook method *if it is defined*.
block optional-interfaces

+ifDocsFor('ts|js')
.l-sub-section
:marked
### Interface optional?

The interfaces are optional for JavaScript and Typescript developers from a purely technical perspective.
The JavaScript language doesn't have interfaces.
Angular can't see TypeScript interfaces at runtime because they disappear from the transpiled JavaScript.
Expand Down Expand Up @@ -86,7 +88,7 @@ table(width="100%")
td ngDoCheck
td
:marked
Detect and act upon changes that Angular can or won't
Detect and act upon changes that Angular can't or won't
detect on its own. Called every change detection run.
tr(style=top)
td ngOnDestroy
Expand Down Expand Up @@ -186,12 +188,11 @@ a(id="other-lifecycles")
## Other lifecycle hooks

Other Angular sub-systems may have their own lifecycle hooks apart from the component hooks we've listed.
The router, for instance, also has it's own [router lifecycle hooks](router.html#router-lifecycle-hooks)
that allow us to tap into specific moments in route navigation.

A parallel can be drawn between `ngOnInit` and `routerOnActivate`.
Both are prefixed so as to avoid collision, and both run right when a component is 'booting' up.
block other-angular-subsystems
//- N/A for TS.

:marked
3rd party libraries might implement their hooks as well in order to give us, the developers, more
control over how these libraries are used.

Expand Down
9 changes: 6 additions & 3 deletions public/docs/ts/latest/guide/lifecycle-hooks.jade
Original file line number Diff line number Diff line change
Expand Up @@ -43,10 +43,12 @@ a#hooks-overview
:marked
No directive or component will implement all of them and some of the hooks only make sense for components.
Angular only calls a directive/component hook method *if it is defined*.
block optional-interfaces

+ifDocsFor('ts|js')
.l-sub-section
:marked
### Interface optional?

The interfaces are optional for JavaScript and Typescript developers from a purely technical perspective.
The JavaScript language doesn't have interfaces.
Angular can't see TypeScript interfaces at runtime because they disappear from the transpiled JavaScript.
Expand Down Expand Up @@ -187,9 +189,10 @@ a(id="other-lifecycles")

Other Angular sub-systems may have their own lifecycle hooks apart from the component hooks we've listed.

A parallel can be drawn between `ngOnInit` and `routerOnActivate`.
Both are prefixed so as to avoid collision, and both run right when a component is 'booting' up.
block other-angular-subsystems
//- N/A for TS.

:marked
3rd party libraries might implement their hooks as well in order to give us, the developers, more
control over how these libraries are used.

Expand Down