O'Reilly logo

Learning Angular for .NET Developers by Rajesh Gunasundaram

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

The local template variable

Angular permits creating template-scoped variables to move data across the elements in a template:

<div *ngFor="let todo of todos">   <todo-item [todo]="todo"></todo-item> </div> 

In the preceding template markup, we have declared a local variable, todo, using the let keyword. Then, we iterate through the collection variable todos; each todo item gets assigned to todo and is available for use in <todo-item>.

A local template variable can also be used to hold the DOM element. The following code shows that the author will hold the input element itself, and the value of the element can be accessed using author.value:

<!-- author refers to input element and passes its `value`to the event handler --> <input #author ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required