Angular Template Directives: ngFor

Learn about Angular's built-in ngFor directive and how to use it in Ionic applications.

We'll cover the following

One of the major hurdles when learning a new framework is getting to grips with the syntax that needs to be used.

Thankfully, with Angular, that isn’t as difficult as it might first appear!

When templating our application, Angular provides the following built-in directives that we can use for manipulating elements and rendering data:

  • The ngFordirective
  • The ngSwitchdirective
  • The ngIfdirective
  • The ngStyledirective
  • The ngClassdirective

ngFor

The ngFor directive is used to iterate through items in an array and render those to the page. This can be applied as an attribute on both Ionic UI components as well as standard HTML tags.

The ngFor directive is prefixed with an asterisk (*), like so:

Get hands-on with 1200+ tech skills courses.