title: Angular2 local template variables
body: <p>In the following example, I designate a local variable <code>#input</code> to multiple radio buttons. When clicking the <code>&lt;tr&gt;</code> I want to select the radio button inside.</p>
  
  <p>And the following code works fine, but I don't understand why. </p>
  
  <p>How can Angular2 "know" which input I'm refering to when ALL of them have the local variable<code>#input</code>?</p>
  
  <p>HTML</p>
  
  <pre><code>  &lt;tr *ngFor="let office of employee.offices" (click)="selectOffice(input)"&gt;
      &lt;td class="select-office-radio"&gt;
        &lt;input type="radio" name="office" #input /&gt;
      &lt;/td&gt;
      &lt;td&gt;
        {{office.officeName}}
      &lt;/td&gt;
    &lt;/tr&gt;
  </code></pre>
  
  <p>JS</p>
  
  <pre><code>selectOffice(input) {
     input.checked = true;
  }
  </code></pre>