docs(template-syntax): update cache copy from latest + post-RC5 Dart resync
closes #2121 Contributes to #2077.
This commit is contained in:
parent
e6db3ebadb
commit
6df26b5058
|
@ -176,7 +176,12 @@ class AppComponent implements OnInit, AfterViewInit {
|
|||
// #enddocregion NgStyle
|
||||
|
||||
String title = 'Template Syntax';
|
||||
// #docregion evil-title
|
||||
String evilTitle = 'Template <script>alert("evil never sleeps")</script>Syntax';
|
||||
// #enddocregion evil-title
|
||||
|
||||
String toeChoice;
|
||||
|
||||
String toeChooser(Element picker) {
|
||||
List<Element> choices = picker.children;
|
||||
for (var i = 0; i < choices.length; i++) {
|
||||
|
|
|
@ -197,13 +197,18 @@ button</button>
|
|||
<!-- #enddocregion property-binding-7 -->
|
||||
|
||||
<!-- #docregion property-binding-vs-interpolation -->
|
||||
Interpolated: <img src="{{heroImageUrl}}"><br>
|
||||
Property bound: <img [src]="heroImageUrl">
|
||||
<p><img src="{{heroImageUrl}}"> is the <i>interpolated</i> image.</p>
|
||||
<p><img [src]="heroImageUrl"> is the <i>property bound</i> image.</p>
|
||||
|
||||
<div>The interpolated title is {{title}}</div>
|
||||
<div [innerHTML]="'The [innerHTML] title is '+title"></div>
|
||||
<p><span>"{{title}}" is the <i>interpolated</i> title.</span></p>
|
||||
<p>"<span [innerHTML]="title"></span>" is the <i>property bound</i> title.</p>
|
||||
<!-- #enddocregion property-binding-vs-interpolation -->
|
||||
|
||||
<!-- #docregion property-binding-vs-interpolation-sanitization -->
|
||||
<p><span>"{{evilTitle}}" is the <i>interpolated</i> evil title.</span></p>
|
||||
<p>"<span [innerHTML]="evilTitle"></span>" is the <i>property bound</i> evil title.</p>
|
||||
<!-- #enddocregion property-binding-vs-interpolation-sanitization -->
|
||||
|
||||
<a class="to-toc" href="#toc">top</a>
|
||||
|
||||
<!-- attribute binding -->
|
||||
|
|
|
@ -858,9 +858,18 @@ block style-property-name-dart-diff
|
|||
header [()] = banana in a box
|
||||
:marked
|
||||
To remember that the parentheses go inside the brackets, visualize a *banana in a box*.
|
||||
:marked
|
||||
Alternatively, we can use the canonical prefix form:
|
||||
+makeExample('template-syntax/ts/app/app.component.html', 'NgModel-2')(format=".")
|
||||
|
||||
+ifDocsFor('ts|js')
|
||||
.callout.is-important
|
||||
header FormsModule is Required to use ngModel
|
||||
:marked
|
||||
Before we can use the `ngModel` directive in a two-way data binding,
|
||||
we must import the `FormsModule` and add it to the Angular module's `imports` list.
|
||||
Learn more about the `FormsModule` and `ngModel` in the
|
||||
[Forms](../guide/forms.html#ngModel) chapter.
|
||||
|
||||
+makeExample('template-syntax/ts/app/app.module.1.ts', '', 'app.module.ts (FormsModule import)')
|
||||
|
||||
:marked
|
||||
There’s a story behind this construction, a story that builds on the property and event binding techniques we learned previously.
|
||||
|
||||
|
|
|
@ -859,20 +859,17 @@ block style-property-name-dart-diff
|
|||
:marked
|
||||
To remember that the parentheses go inside the brackets, visualize a *banana in a box*.
|
||||
|
||||
.callout.is-important
|
||||
+ifDocsFor('ts|js')
|
||||
.callout.is-important
|
||||
header FormsModule is Required to use ngModel
|
||||
:marked
|
||||
Before we can use `ngModel` two-way data binding, we need to import the `FormsModule`
|
||||
package in our Angular module. We add it to the `NgModule` decorator's `imports` array. This array contains the list
|
||||
of external modules used by our application.
|
||||
<br>Learn more about the `FormsModule` and `ngModel` in the
|
||||
Before we can use the `ngModel` directive in a two-way data binding,
|
||||
we must import the `FormsModule` and add it to the Angular module's `imports` list.
|
||||
Learn more about the `FormsModule` and `ngModel` in the
|
||||
[Forms](../guide/forms.html#ngModel) chapter.
|
||||
|
||||
+makeExample('template-syntax/ts/app/app.module.1.ts', '', 'app.module.ts (FormsModule import)')
|
||||
+makeExample('template-syntax/ts/app/app.module.1.ts', '', 'app.module.ts (FormsModule import)')
|
||||
|
||||
:marked
|
||||
Alternatively to using `[(ngModel)]`, we can use the canonical prefix form:
|
||||
+makeExample('template-syntax/ts/app/app.component.html', 'NgModel-2')(format=".")
|
||||
:marked
|
||||
There’s a story behind this construction, a story that builds on the property and event binding techniques we learned previously.
|
||||
|
||||
|
|
Loading…
Reference in New Issue