Template <input> local variable value not updated as user types

To illustrate this problem, I setup the Angular 2 quickstart example for Dart named hello_world, and changed the template to be:

<div>
  <h1>Hello {{ nm.value }}</h1>
  <input #nm value="Al" type="text" >
  <a href="#" (click)="0">Do nothing</a>
</div>

When I launch the app I see “Hello Al” as expected. If I type new input text in the browser, the <h1> greeting DOES NOT update. But if I click on the “Do nothing” link (which invokes a noop event handler), then the <h1> greeting updates to match the input text value.

Shouldn’t nm.value in the <h1> greeting update as I type?

Now, by extension of the above, if I add a noop event handler (input)="0" to the <input> element, then the update to the input text gets propagated as I type. Is this the way to go? (Note that in this example I am deliberately trying to avoid using a model field as an intermediary to transport input value.)

I’m thinking that this might be a consequence of the new Angular 2 digest phase (vs. digest cycle), but I wanted to double check that this isn’t a bug. E.g. pkozlowski-opensource/ng2-play uses a timer to delay the change of a model field, and the change is detected. Why can’t nm be considered a “template local” model field and hence have any updates picked up automatically?

Btw, note that I have tested this with the current head of angular (i.e., 1872b03fb8513614eca0111d92f3316ee1f9672e).

[mhevery]

This works as intended. You must have a listener such as <input (keyup)> to trigger change detection.

We will document this.

[angular-automatic-lock-bot[bot]]

This issue has been automatically locked due to inactivity. Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}