woensdag 3 januari 2018

Angular template syntax alternative writing

<some-component 
  [prop]="someExp" 
  (event)="someEvent()" 
  [(twoWayProp)]="someExp">
</some-component>
<video-player #player></video-player> 

is the same as:

<some-component 
  bind-prop="someExp" 
  on-event="someEvent()" 
  bindon-twowayprop="someExp">
</some-component>
<video-player ref-player></video-player>

en
<todo-cmp 
  *ngFor="let t of todos; let i=index" 
  [model]="t" [index]="t">
</todo-cmp>

desugars into:

<todo-cmp 
  template="ngFor: let t of todos; let i=index" 
  [model]="t" [index]="i">
</todo-cmp>

desugars into:

<ng-template ngFor [ngForOf]="todos" 
  let-t="$implicit" let-i="index">
  <todo-cmp [model]="t" [index]="i"></todo-cmp>
</ng-template>

Other example. *ngIf desugars into:

<ng-template [ngIf]="true"></ng-template>

Geen opmerkingen:

Een reactie posten