File tree 4 files changed +34
-22
lines changed
_examples/template-syntax/dart/lib
4 files changed +34
-22
lines changed Original file line number Diff line number Diff line change @@ -176,7 +176,12 @@ class AppComponent implements OnInit, AfterViewInit {
176
176
// #enddocregion NgStyle
177
177
178
178
String title = 'Template Syntax' ;
179
+ // #docregion evil-title
180
+ String evilTitle = 'Template <script>alert("evil never sleeps")</script>Syntax' ;
181
+ // #enddocregion evil-title
182
+
179
183
String toeChoice;
184
+
180
185
String toeChooser (Element picker) {
181
186
List <Element > choices = picker.children;
182
187
for (var i = 0 ; i < choices.length; i++ ) {
Original file line number Diff line number Diff line change @@ -197,13 +197,18 @@ <h3>
197
197
<!-- #enddocregion property-binding-7 -->
198
198
199
199
<!-- #docregion property-binding-vs-interpolation -->
200
- Interpolated: < img src ="{{heroImageUrl}} "> < br >
201
- Property bound: < img [src] ="heroImageUrl ">
200
+ < p > < img src ="{{heroImageUrl}} "> is the < i > interpolated </ i > image. </ p >
201
+ < p > < img [src] ="heroImageUrl "> is the < i > property bound </ i > image. </ p >
202
202
203
- < div > The interpolated title is {{title}}</ div >
204
- < div [innerHTML] ="'The [innerHTML] title is '+title " > </ div >
203
+ < p > < span > " {{title}}" is the < i > interpolated </ i > title. </ span > </ p >
204
+ < p > " < span [innerHTML] ="title " > </ span > " is the < i > property bound </ i > title. </ p >
205
205
<!-- #enddocregion property-binding-vs-interpolation -->
206
206
207
+ <!-- #docregion property-binding-vs-interpolation-sanitization -->
208
+ < p > < span > "{{evilTitle}}" is the < i > interpolated</ i > evil title.</ span > </ p >
209
+ < p > "< span [innerHTML] ="evilTitle "> </ span > " is the < i > property bound</ i > evil title.</ p >
210
+ <!-- #enddocregion property-binding-vs-interpolation-sanitization -->
211
+
207
212
< a class ="to-toc " href ="#toc "> top</ a >
208
213
209
214
<!-- attribute binding -->
Original file line number Diff line number Diff line change @@ -859,16 +859,17 @@ block style-property-name-dart-diff
859
859
:marked
860
860
To remember that the parentheses go inside the brackets, visualize a *banana in a box*.
861
861
862
- .callout.is-important
863
- header FormsModule is Required to use ngModel
864
- :marked
865
- Before we can use `ngModel` two-way data binding, we need to import the `FormsModule`
866
- package in our Angular module. We add it to the `NgModule` decorator's `imports` array. This array contains the list
867
- of external modules used by our application.
868
- <br>Learn more about the `FormsModule` and `ngModel` in the
869
- [Forms](../guide/forms.html#ngModel) chapter.
862
+ + ifDocsFor('ts|js' )
863
+ .callout.is-important
864
+ header FormsModule is Required to use ngModel
865
+ :marked
866
+ Before we can use `ngModel` two-way data binding, we need to import the `FormsModule`
867
+ package in our Angular module. We add it to the `NgModule` decorator's `imports` array. This array contains the list
868
+ of external modules used by our application.
869
+ <br>Learn more about the `FormsModule` and `ngModel` in the
870
+ [Forms](../guide/forms.html#ngModel) chapter.
870
871
871
- + makeExample('template-syntax/ts/app/app.module.1.ts' , '' , 'app.module.ts (FormsModule import)' )
872
+ + makeExample('template-syntax/ts/app/app.module.1.ts' , '' , 'app.module.ts (FormsModule import)' )
872
873
873
874
:marked
874
875
Alternatively to using `[(ngModel)]`, we can use the canonical prefix form:
Original file line number Diff line number Diff line change @@ -859,16 +859,17 @@ block style-property-name-dart-diff
859
859
:marked
860
860
To remember that the parentheses go inside the brackets, visualize a *banana in a box*.
861
861
862
- .callout.is-important
863
- header FormsModule is Required to use ngModel
864
- :marked
865
- Before we can use `ngModel` two-way data binding, we need to import the `FormsModule`
866
- package in our Angular module. We add it to the `NgModule` decorator's `imports` array. This array contains the list
867
- of external modules used by our application.
868
- <br>Learn more about the `FormsModule` and `ngModel` in the
869
- [Forms](../guide/forms.html#ngModel) chapter.
862
+ + ifDocsFor('ts|js' )
863
+ .callout.is-important
864
+ header FormsModule is Required to use ngModel
865
+ :marked
866
+ Before we can use `ngModel` two-way data binding, we need to import the `FormsModule`
867
+ package in our Angular module. We add it to the `NgModule` decorator's `imports` array. This array contains the list
868
+ of external modules used by our application.
869
+ <br>Learn more about the `FormsModule` and `ngModel` in the
870
+ [Forms](../guide/forms.html#ngModel) chapter.
870
871
871
- + makeExample('template-syntax/ts/app/app.module.1.ts' , '' , 'app.module.ts (FormsModule import)' )
872
+ + makeExample('template-syntax/ts/app/app.module.1.ts' , '' , 'app.module.ts (FormsModule import)' )
872
873
873
874
:marked
874
875
Alternatively to using `[(ngModel)]`, we can use the canonical prefix form:
You can’t perform that action at this time.
0 commit comments