title: ngFor object in click event
body: <p>I'm working on an application which shows a list of elements (with ngFor) which also have an "add" Button. When clicking on a button, the element should be shown in a separate list:</p>
  
  <pre class="lang-html prettyprint-override"><code>&lt;ul&gt;
      &lt;li *ngFor="let trooper of impalasum"&gt;
          {{trooper.name}} &lt;button id="btn_{{trooper.name}}" (click)="addToList({{trooper}})"&gt;Add&lt;/button&gt;
      &lt;/li&gt;
  &lt;/ul&gt; 
  &lt;hr&gt;
  &lt;ul&gt;
      &lt;li&gt;{{addedTrooper.name}} -&gt; XY&lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>
  
  <pre class="lang-ts prettyprint-override"><code>addToList(troop: Trooper): void{
      this.addedTrooper = troop;
  }
  </code></pre>
  
  <p>I want to have the trooper as a parameter in the click event, but this way it doesn't work. So how can I do that? </p>