I am creating a simple app to test some stuff using observables and for some reason, when I wrap that code using an ng-template tag, the HTML simply doesn't show up.
The reason I'm using this ng-template before the div, is to use an *ngIf. Initially, I thought that the *ngIf was the problem, but when I removed that statement from the template, it still did not work. So the If is not the problem.
Any idea?
<!-- If I remove the <ng-template> tag, the HTML is rendered, but with it, it doesn't work -->
<ng-template>
<div *ngIf="(messagesService.errors$ | async) as errors">
<div *ngFor="let error of errors">{{error}}</div>
<mat-icon (click)="onClose()">close</mat-icon>
</div>
</ng-template>
Edit: When I use [ngIf] instead of *ngIf it works, but I still don't understand why works whit [ngIf] and why it does not work with no condition.
CodePudding user response:
star syntax in structural directives like here *ngIf
implicitly creates a template from the element that this directive is being used on. no need to explicitly write <ng-temlate>
just use *ngIf