Uporabljam Angular in v tem primeru želim uporabiti *ngIf else
(na voljo od različice 4):
<div *ngIf="isValid">
content here ...
</div>
<div *ngIf="!isValid">
other content here...
</div>
Kako lahko dosežem enako obnašanje z ngIf else
?
Angular 4 in 5:
z uporabo else
:
<div *ngIf="isValid;else other_content">
content here ...
</div>
<ng-template #other_content>other content here...</ng-template>
lahko uporabite tudi tudi drugače
:
<div *ngIf="isValid;then content else other_content">here is ignored</div>
<ng-template #content>content here...</ng-template>
<ng-template #other_content>other content here...</ng-template>
ali samo then
:
<div *ngIf="isValid;then content"></div>
<ng-template #content>content here...</ng-template>
Demo :
[Plunker][1]
Podrobnosti:
<ng-template>
: je Angularjeva lastna implementacija oznake <template>
, ki je v skladu z [MDN][2] :
Element HTML
<template>
je mehanizem za hranjenje odjemalčevih vsebine, ki se ne bo prikazala ob nalaganju strani, vendar se lahko se pozneje instantizira med izvajanjem z uporabo JavaScripta.
"bindEmail" bo preveril e-pošto je na voljo ali ne. če e-pošta obstaja kot Odjava bo prikazano drugače Prijava bo prikazano
<li *ngIf="bindEmail;then logout else login"></li>
<ng-template #logout><li><a routerLink="/logout">Logout</a></li></ng-template>
<ng-template #login><li><a routerLink="/login">Login</a></li></ng-template>
V Angularju 4.0 je sintaksa if..else
precej podobna pogojnim operatorjem v Javi.
V Javi uporabite "condition?stmnt1:stmnt2"
.
V Angularju 4.0 uporabljate *ngIf="condition;then stmnt1 else stmnt2"
.