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

Commit d02d098

Browse files
committed
docs(template-syntax): clarify context discussions
closes #996
1 parent ded7bb7 commit d02d098

File tree

1 file changed

+12
-14
lines changed

1 file changed

+12
-14
lines changed

public/docs/ts/latest/guide/template-syntax.jade

Lines changed: 12 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -6,9 +6,7 @@ include ../_util-fns
66

77
Many of us are familiar with the component/template duality from our experience with model-view-controller (MVC) or model-view-viewmodel (MVVM). In Angular, the component plays the part of the controller/viewmodel, and the template represents the view.
88

9-
Let’s find out what it takes to write a template for our view. We’ll cover these basic elements of template syntax.
10-
11-
# Table Of Contents
9+
Let’s find out what it takes to write a template for our view. We’ll cover these basic elements of template syntax:
1210

1311
* [HTML](#html)
1412
* [Interpolation](#interpolation)
@@ -30,13 +28,13 @@ include ../_util-fns
3028
* [Input and output properties](#inputs-outputs)
3129
* [Template expression operators](#expression-operators)
3230
* [pipe](#pipe)
33-
* ["elvis" (?.)](#elvis)
31+
* ["elvis" (?.)](#elvis)
3432
// #enddocregion intro
3533
.l-sub-section
3634
:marked
37-
The [live example](/resources/live-examples/template-syntax/ts/plnkr.html)
35+
The [live example](/resources/live-examples/template-syntax/ts/plnkr.html)
3836
demonstrates all of the syntax and code snippets described in this chapter.
39-
37+
4038
// #docregion html-1
4139
.l-main-section
4240
:marked
@@ -130,13 +128,13 @@ include ../_util-fns
130128
// #enddocregion template-expressions-2
131129
132130
// #docregion template-expressions-context
131+
- var lang = current.path[1]
132+
- var details = lang === 'dart' ? 'template expressions can’t refer to static properties, nor to top-level variables or functions, such as <code>window</code> or <code>document</code> from <code>dart:html</code>. They can’t directly call <code>print</code> or functions imported from <code>dart:math</code>. They are restricted to referencing members of the expression context.' : 'template expressions cannot refer to anything in the global namespace. They can’t refer to <code>window</code> or <code>document</code>. They can’t call <code>console.log</code> or <code>Math.max</code>. They are restricted to referencing members of the expression context.'
133133
:marked
134134
<a id="expression-context"></a>
135135
### Expression context
136136

137-
Perhaps more surprising, template expressions cannot refer to anything in the global namespace.
138-
They can’t refer to `window` or `document`. They can’t call `console.log` or `Math.max`.
139-
They are restricted to referencing members of the expression context.
137+
Perhaps more surprising, !{details}
140138

141139
The *expression context* is typically the **component instance**, which is
142140
the source of binding values.
@@ -241,14 +239,14 @@ include ../_util-fns
241239
// #enddocregion template-statements-2
242240
243241
// #docregion template-statements-3
242+
- var lang = current.path[1]
243+
- var details = lang === 'dart' ? 'Template statements can’t refer to static properties on the class, nor to top-level variables or functions, such as <code>window</code> or <code>document</code> from <code>dart:html</code>. They can’t directly call <code>print</code> or functions imported from <code>dart:math</code>.' : 'Template statements cannot refer to anything in the global namespace. They can’t refer to <code>window</code> or <code>document</code>. They can’t call <code>console.log</code> or <code>Math.max</code>.'
244244
:marked
245245
### Statement context
246246

247-
As with expressions, statements cannot refer to anything in the global namespace.
248-
They can’t refer to `window` or `document`. They can’t call `console.log` or `Math.max`.
249-
250-
Statements are restricted to referencing members of the statement context.
251-
The statement context is typically the **component instance** to which we are binding an event.
247+
As with expressions, statements can refer only to what's in the statement context — typically the
248+
**component instance** to which we're binding the event.
249+
!{details}
252250

253251
The *onSave* in `(click)="onSave()"` is sure to be a method of the data-bound component instance.
254252

0 commit comments

Comments
 (0)