56-tools:angular
Différences
Ci-dessous, les différences entre deux révisions de la page.
| Les deux révisions précédentesRévision précédenteProchaine révision | Révision précédente | ||
| 56-tools:angular [2018/04/08 20:44] – [*ngFor] Roge | 56-tools:angular [2018/04/08 20:48] (Version actuelle) – [*ngFor] Roge | ||
|---|---|---|---|
| Ligne 81: | Ligne 81: | ||
| ==== *ngIf ==== | ==== *ngIf ==== | ||
| + | Micro syntax: | ||
| < | < | ||
| - | <p *ngIf=" | + | <div *ngIf=" |
| - | | + | </ |
| - | | + | |
| - | </p> | + | Equivallent full syntax: |
| + | < | ||
| + | < | ||
| + | | ||
| + | </ng-template> | ||
| </ | </ | ||
| ==== *ngFor ==== | ==== *ngFor ==== | ||
| Ligne 103: | Ligne 108: | ||
| </ | </ | ||
| - | ==== *ngFor | + | ==== ngSwitch |
| Micro code: | Micro code: | ||
| < | < | ||
| - | <div *ngFor="let hero of heroes; let i=index; let odd=odd; trackBy: trackById" [class.odd]="odd"> | + | < |
| - | | + | < |
| + | < | ||
| + | | ||
| + | < | ||
| </ | </ | ||
| </ | </ | ||
| Ligne 114: | Ligne 122: | ||
| Equivalent full syntax: | Equivalent full syntax: | ||
| < | < | ||
| - | < | + | <div [ngSwitch]=" |
| - | <div [class.odd]="odd">({{i}}) {{hero.name}}</div> | + | |
| - | </ | + | < |
| + | </ | ||
| + | < | ||
| + | <app-sad-hero [hero]="hero"></ | ||
| + | </ | ||
| + | < | ||
| + | <app-confused-hero | ||
| + | | ||
| + | < | ||
| + | < | ||
| + | | ||
| + | </div> | ||
| </ | </ | ||
| ===== Input and Output properties ===== | ===== Input and Output properties ===== | ||
Dernière modification : 2018/04/08 20:44