Angular 2 Image Link in ngFor Loop Or Make Empty Rows in Angular 2 For No Reason

If you're interested in dynamically generating an image link in say, a table, inside an Angular 2 project, take a look what's required.  If you have an image link in your table and you're wondering why it's displaying an extra "row" every time, then you've come to the right place.

<table>
           <tr *ngIf="angels.players" *ngFor="#player of angels.players">
                  <td>
                              First Name: {{player.firstName}}
                  </td>
                   <td>
                              Last Name: {{player.lastName}}
                  </td>
                   <td>
                              Jersey Number: {{player.jerseyNumber}}
                  </td>
                   <td>
                              <a>
                                     <img src=" ../../images/updateIcon.png " class="small                                                                                (click)="btnUpdatePlayerOnClick() " />
                             </a>
                  </td>
           </tr>
</table>

Don't do this unless you want an extra row in your table:

                   <td>
                              <img src=" ../../images/updateIcon.png " class="small                                                                                (click)="btnUpdatePlayerOnClick() " />
                  </td>

Woof!