I have been reading the Angular 1 to 2 quick reference in the Angular website, and one thing I didn’t completely understand was the difference between these special characters. For example one that uses asterisks:

<tr *ngFor="#movie of movies">
   <td>{{movie.title}}</td>
</tr>

I understand here that the hash (#) symbol defines movie as a local template variable, but what does the asterisk before ngFor mean? And, is it necessary?

Next, are the examples that use brackets:

<a [routerLink]="['Movies']">Movies</a>

I somewhat understand that the brackets around routerLink bind it to that HTML attribute / Angular directive. Does this mean that they are a pointer for Angular to evaluate an expression? Like [id]="movieId" would be the equivalent of id="movie-{{movieId}}" in Angular 1?

Lastly, are parentheses:

<button (click)="toggleImage($event)">

Are these only used for DOM events and can we use other events like (load)="someFn()" or (mouseenter)="someFn()"?

I guess the real question is, do these symbols have a special meaning in Angular 2, and what is the easiest way to know when to use each one? Thanks!!

3 Answers
3

Tags:

Leave a Reply

Your email address will not be published. Required fields are marked *