https://github.com/ghoul007/angular-ngfor

Tips & Tricks
https://github.com/ghoul007/angular-ngfor

Last synced: about 1 month ago
JSON representation

Tips & Tricks

• Host: GitHub
• URL: https://github.com/ghoul007/angular-ngfor
• Owner: ghoul007
• Created: 2019-09-30T16:58:29.000Z (over 5 years ago)
• Default Branch: master
• Last Pushed: 2023-01-07T10:15:02.000Z (about 2 years ago)
• Last Synced: 2024-04-24T10:24:13.467Z (9 months ago)
• Language: TypeScript
• Size: 1.82 MB
• Stars: 3
• Watchers: 2
• Forks: 1
• Open Issues: 27
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# Ngfor

> This project was generated with [Angular CLI](https://github.com/angular/angular-cli) version 8.3.6.

---

## TrackBy

The trackBy function takes the index and the current item as arguments and returns the unique identifier by which that item should be tracked

```diff



- 
{{todo.id}}

+ 
{{todo.id}}



```


```js

  trackElement(index: number, element: any) {

    return element ? element.id : null

  }

```

|  Without trackBy | With trackBy  |

|---|---|

|   |   |

---

## NgForOf

A structural directive that renders a template for each item in a collection. The directive is placed on an element, which becomes the parent of the cloned templates.

[See more](https://angular.io/api/common/NgForOf#description)

```html

	{{i}}-{{cell.id}}/

```

---

###  Index, First, Last, Even, odd

 - `index: number`: The index of the current item in the iterable.

 - `first: boolean`: True when the item is the first item in the iterable.

 - `last: boolean`: True when the item is the last item in the iterable.

 - `even: boolean`: True when the item has an even index in the iterable.

 - `odd: boolean`: True when the item has an odd index in the iterable.

 ```html

  


     {{i}}/{{users.length}}. {{user}} default

  

 ```