Event handlers inside template nodes cannot use template variables in beta 16

[bryanforbes]

Steps to reproduce and a minimal demo of the problem

Demo: https://gist.run/?id=7500849bedd0559d80faa27d087f7179

What steps should we try in your demo to see the problem?

1. Click both buttons

Current behavior

The text next to the first button displays "undefined"

Expected/desired behavior

The text next to the second button displays "A Thing"

Other information

I've narrowed the problem down to the code generated for the event handlers:

// click handler for the first button (inside a template node)
_View_App1.prototype._handle_click_1_0 = function($event) {
  var self = this;
  self.markPathToRootAsCheckOnce();
  self.debug(1,2,26);
  var pd_0 = (self.context.onClickFirst(self.context.thing) !== false);
  return (true && pd_0);
};

// click handler for the second button (outside a template node)
_View_App0.prototype._handle_click_5_0 = function($event) {
  var self = this;
  self.markPathToRootAsCheckOnce();
  self.debug(5,7,26);
  var pd_0 = (self.context.onClickSecond(self._Foo_10_4) !== false);
  return (true && pd_0);
};

In _View_App1.prototype._handle_click_1_0, self.context is the App instance and thing does not exist on it in.

[tbosch]

Yes, this is a bug. Can be simplified to the following:
This works:

    <div #thing></div>
    <template [ngIf]="true">
    Thing: {{thing.nodeName}}
    </template>

This does not work:

    <template [ngIf]="true">
    Thing: {{thing.nodeName}}
    </template>
    <div #thing></div>

I.e. a <template> can't reference a variable that was declared after it.

[zoechi]

looks like #2451, #6179

[bryanforbes]

@zoechi It may be related to #6179, however if you change the version in my gist from 16 to 15, it will work so I'm not sure how related they are.

[angular-automatic-lock-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.}