why *ngIf doesnt'work with ng-template?
I have a condition in the template as follows:
-
Read the doc here https://angular.io/guide/structural-directives especially for
<div *ngIf="hero" >{{hero.name}}</div>The asterisk is "syntactic sugar" for something a bit more complicated. Internally, Angular desugars it in two stages. First, it translates the *ngIf="..." into a template attribute, template="ngIf ...", like this.
<div template="ngIf hero">{{hero.name}}</div>Then it translates the template attribute into a element, wrapped around the host element, like this.
<ng-template [ngIf]="hero"> <div>{{hero.name}}</div></ng-template>- The *ngIf directive moved to the element where it became a property binding,[ngIf].
- The rest of the , including its class attribute, moved inside the element.
So for it we have
ng-container<ng-container *ngIf="seat.section"> Section {{seat.section}} , </ng-container>or use span or div or regular html tag.
<span *ngIf="seat.section"> Section {{seat.section}} , </span>or if you still want to use ng-template (not recommended)
<ng-template [ngIf]="seat.section"> Section {{seat.section}} , </ng-template>讨论(0)
加载中...
- 热议问题