parent
f4acc0ccbc
commit
fe0f8086f4
|
@ -25,7 +25,7 @@ include ../../../../_includes/_util-fns
|
|||
of JavaScript with a few added tricks.
|
||||
|
||||
When writing a binding we must be aware of a template expression's **execution context**.
|
||||
The identifers appearing within an expression belong to a specific context object.
|
||||
The identifiers appearing within an expression belong to a specific context object.
|
||||
That object is usually the Angular component that controls the template ... which it definitely is
|
||||
in this case because that snippet of HTML belongs to the following component:
|
||||
|
||||
|
@ -54,8 +54,8 @@ include ../../../../_includes/_util-fns
|
|||
[`HTMLInputElement`](https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement) which
|
||||
has a `value` property and that's where we find our user input data.
|
||||
|
||||
With had this in mind when we passed `$event` to our `onKey()` component method where we extract the user's input and
|
||||
concatenate it to the previous user data that we're accumulating in the component's' `values` property.
|
||||
We had this in mind when we passed `$event` to our `onKey()` component method. This is where we extract the user's input and
|
||||
concatenate it to the previous user data that we're accumulating in the component's `values` property.
|
||||
We then use [interpolation](./template-syntax.html#interpolation)
|
||||
to display the accumulating `values` property back on screen.
|
||||
|
||||
|
@ -84,7 +84,7 @@ figure.image-display
|
|||
## Get user input from a local template variable
|
||||
There's another way to get the user data without the `$event` variable.
|
||||
|
||||
Angular has syntax feature called [**local template variables**](./template-syntax.html#local-vars).
|
||||
Angular has a syntax feature called [**local template variables**](./template-syntax.html#local-vars).
|
||||
These variables grant us direct access to an element.
|
||||
We declare a local template variable by preceding an identifier with a hash/pound character (#).
|
||||
|
||||
|
@ -181,7 +181,7 @@ figure.image-display
|
|||
The *newHero* template variable refers to the `<input>` element.
|
||||
|
||||
We can access `newHero` from any sibling or child of the `<input>` element.
|
||||
When the user clicks the button, we don't need a fancy css selector to
|
||||
When the user clicks the button, we don't need a fancy CSS selector to
|
||||
track down the textbox and extract its value.
|
||||
|
||||
### Extract the input box *value*
|
||||
|
@ -237,5 +237,3 @@ figure.image-display
|
|||
|
||||
Angular has a two-way binding called `NgModel` and we learn about it
|
||||
in the `Forms` chapter.
|
||||
|
||||
|
||||
|
|
Loading…
Reference in New Issue