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

Commit a59aafe

Browse files
committed
docs(architecture/dart): post-review changes
1 parent 258c81a commit a59aafe

File tree

4 files changed

+45
-26
lines changed

4 files changed

+45
-26
lines changed

public/docs/_examples/architecture/dart/lib/hero_list_component.dart

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -15,11 +15,11 @@ import 'hero_service.dart';
1515
// #docregion class
1616
class HeroListComponent implements OnInit {
1717
// #enddocregion metadata, providers
18-
final HeroService _heroService;
1918
List<Hero> heroes;
2019
Hero selectedHero;
21-
2220
// #docregion ctor
21+
final HeroService _heroService;
22+
2323
HeroListComponent(this._heroService);
2424
// #enddocregion ctor
2525

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
!= partial("../../../_includes/_ts-temp")

public/docs/dart/latest/guide/architecture.jade

Lines changed: 30 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -14,29 +14,39 @@ block angular-parts
1414
Angular 2 for Dart is published as the `angular2` package, which
1515
(like many other Dart packages) is available via the Pub tool.
1616

17-
block dart-terminology
17+
block modules-in-dart
1818
.callout.is-helpful
19-
header Dart difference: Module is a compilation unit
19+
header Dart difference: Modules are compilation units or packages
2020
:marked
21-
The term "module" used in this guide refers to a
22-
Dart _compilation unit_, i.e., a _library_ or _part_.
23-
For more information about compilation units, see
21+
In this guide, the term _module_ refers to a Dart compilation unit, such
22+
as a library, or a package. (If a Dart file has no `library` or `part`
23+
directive, then that file itself is a library and thus a compilation
24+
unit.) For more information about compilation units, see
2425
the chapter on "Libraries and Scripts" in the
2526
[Dart Language Specification](https://www.dartlang.org/docs/spec/).
2627

2728
block modules-are-optional
2829
//- N/A
2930
30-
block ts-export
31-
//- N/A
31+
block export-qualifier
32+
.callout.is-helpful
33+
header Dart difference: Public names are exported by default
34+
:marked
35+
Contrary to TypeScript, a Dart library always exports all names and
36+
declarations in its **public** namespace, making explicit `export`
37+
qualifiers unnecessary.
38+
39+
When we say that a module _exports_ a declaration, we mean that the
40+
declaration is _public_. For more details about name spaces and export
41+
statements, see the section on "Exports" in the
42+
[Dart Language Specification](https://www.dartlang.org/docs/spec/).
3243

3344
block ts-import
3445
//- N/A
3546
3647
block angular-library-modules
3748
:marked
38-
Some modules are libraries.
39-
Angular itself ships as a collection of libraries within the
49+
Angular ships as a collection of libraries within the
4050
[**angular2**](https://pub.dartlang.org/packages/angular2) package.
4151

4252
block angular-imports
@@ -49,3 +59,14 @@ block ts-decorator
4959
information Angular needs to create and present the component and its view.
5060

5161
Here are a few of the possible `@Component` parameters:
62+
63+
block dart-bool
64+
.callout.is-helpful
65+
header Dart difference: Only true is true
66+
:marked
67+
In Dart, **the only value that is true is the boolean value `true`**; all
68+
other values are false. JavaScript and TypeScript, in contrast, treat values
69+
such as 1 and most non-null objects as true. For this reason, the JavaScript
70+
and TypeScript versions of this app can use just `selectedHero` as the value
71+
of the `*ngIf` expression. The Dart version must use a boolean operator such
72+
as `!=` instead.

public/docs/ts/latest/guide/architecture.jade

Lines changed: 12 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -57,7 +57,7 @@ figure
5757
A module **exports** something of value in that code, typically one thing such as a class.
5858
<br clear="all"><br>
5959

60-
block dart-terminology
60+
block modules-in-dart
6161
//- N/A
6262
6363
block modules-are-optional
@@ -73,18 +73,19 @@ block modules-are-optional
7373
Find setup and organization clues in the JavaScript track (select it from the combo-box at the top of this page)
7474
which demonstrates Angular 2 development with plain old JavaScript and no module system.
7575

76+
- var _app_comp_filename = _docsFor == 'dart' ? 'app_component.dart' : 'app.component.ts';
7677
:marked
7778
Perhaps the first module we meet is a module that exports a *component* class.
7879
The component is one of the basic Angular blocks, we write a lot of them,
7980
and we'll talk about components in the next segment. For the moment it is enough to know that a
8081
component class is the kind of thing we'd export from a module.
8182

82-
Most applications have an `AppComponent`. By convention, we'll find it in a file named `app.component.ts`.
83+
Most applications have an `AppComponent`. By convention, we'll find it in a file named `!{_app_comp_filename}`.
8384
Look inside such a file and we'll see a declaration like this one.
8485

8586
+makeExcerpt('app/app.component.ts ()', 'export')
8687

87-
block ts-export
88+
block export-qualifier
8889
:marked
8990
The `export` statement tells TypeScript that this is a module whose
9091
`AppComponent` class is public and accessible to other modules of the application.
@@ -150,13 +151,15 @@ block angular-imports
150151
While we're focused on our application, *import* and *export*
151152
is about all we need to know.
152153

154+
- var _export = _docsFor == 'dart' ? 'publicly declare' : 'export';
155+
- var _declare = _docsFor == 'dart' ? 'declare' : 'export';
153156
:marked
154157
The key take-aways are:
155158
* Angular apps are composed of modules.
156-
* Modules export things &mdash; classes, function, values &mdash; that other modules import.
159+
* Modules !{_export} things &mdash; classes, function, values &mdash; that other modules import.
157160
* We prefer to write our application as a collection of modules, each module exporting one thing.
158161

159-
The first module we write will most likely export a component.
162+
The first module we write will most likely !{_declare} a component.
160163

161164
.l-main-section
162165
:marked
@@ -181,7 +184,7 @@ figure
181184
+makeExcerpt('app/hero-list.component.ts', 'class')
182185
:marked
183186
Angular creates, updates, and destroys components as the user moves through the application.
184-
The developer can take action at each moment in this lifecycle through optional [lifecycle hooks](lifecycle-hooks.html).
187+
The developer can take action at each moment in this lifecycle through optional [lifecycle hooks](lifecycle-hooks.html), like `ngOnInit()` declared above.
185188
.l-sub-section
186189
:marked
187190
We may wonder who is calling the component's constructor? Who provides the service parameter?
@@ -391,14 +394,8 @@ figure
391394
* [`*ngFor`](displaying-data.html#ngFor) tells Angular to stamp out one `<li>` per hero in the `heroes` list.
392395
* [`*ngIf`](displaying-data.html#ngIf) includes the `HeroDetail` component only if a selected hero exists.
393396

394-
.l-sub-section
395-
:marked
396-
In Dart, **the only value that is true is the boolean value `true`**; all
397-
other values are false. JavaScript and TypeScript, in contrast, treat values
398-
such as 1 and most non-null objects as true. For this reason, the JavaScript
399-
and TypeScript versions of this app can use just `selectedHero` as the value
400-
of the `*ngIf` expression. The Dart version must use a boolean operator such
401-
as `!=` instead.
397+
block dart-bool
398+
//- N/A
402399
403400
:marked
404401
**Attribute** directives alter the appearance or behavior of an existing element.
@@ -412,7 +409,7 @@ figure
412409
+makeExcerpt('app/hero-detail.component.html', 'ngModel')
413410
:marked
414411
Angular ships with a small number of other directives that either alter the layout structure
415-
(e.g. [ngSwitch](template-syntax.html#ngSwitch))
412+
(for example, [ngSwitch](template-syntax.html#ngSwitch))
416413
or modify aspects of DOM elements and components
417414
(for example, [ngStyle](template-syntax.html#ngStyle) and [ngClass](template-syntax.html#ngClass)).
418415

0 commit comments

Comments
 (0)