Loop Through Angular 2 Components with ngFor

InstructorJohn Lindquist

Share this video with your friends

Send Tweet

This lesson covers Angular 2’s version of looping through data in your templates: *ngFor. It’s conceptually the same as Angular 1’s ng-repeat, but you’ll find the syntax quite different as it aligns with #refs in Angular 2 and JavaScript “for of” loop.

Nils
~ 9 years ago

i dont really understand what the [TodoService] in main.ts gives us ?. We still need to import it in every "module"? that wants to use it. tnx

Leon
~ 9 years ago

The TodoService just contains the todo array. So 1 module pushes todo's into that Array, and the other module just displays the todos in the array on the page. Yeah it seems to be exactly like Angular 1, where you have to import a service into every Controller where you want to use it.

Goma Games
~ 8 years ago

in the latest version of angular2, instead of using

<li *ngFor="#todo of todoService.todos">

the new syntax should be

<li *ngFor="let todo of todoService.todos">