我正在尝试加载pictureA or pictureB。
我的第一个解决方案是这样的：
<img *ngIf="my_picture" src="{{my_picture}}" width="180" height="80" >
<img *ngIf="default_picture && !my_picture" src="{{default_picture}}">
但我想用if-else如 API 参考：
<div *ngIf="condition; else elseBlock">...</div>
<ng-template #elseBlock>...</ng-template>
所以，我尝试这样做：
<div *ngIf="my_picture; else elseBlock">
<img src="{{my_picture}}" >
</div>
<ng-template #elseBlock>
<img src="{{default_picture}}" >
</ng-template>
但我得到了一个很大的异常堆栈跟踪：
zone.js:388 Unhandled Promise rejection: Template parse errors:
Can't bind to 'ngIfElse' since it isn't a known property of 'div'. ("
-->
<div [ERROR ->]*ngIf="my_picture; else elseBlock">
<img src="{{my_picture}}"): UserComponent@15:13
Property binding ngIfElse not used by any directive on an embedded template. Make sure that the property name is spelled correctly and
所有指令都列在“@NgModule.declarations”中。 （“
-->
[ERROR ->]<div *ngIf="my_picture; else elseBlock">
<img src="{{my_picture}}" width="180" height="8"): UserComponent@15:8
'ng-template' is not a known element
我怎样才能实现一个简单的if-else block?
你应该使用 ng-template
<ng-template #loading>Failed to do something wrong...</ng-template>
<div *ngIf="userObservable;else loading;">
Aravind is here
</div>
<button (click)="userObservable = !userObservable">Click to toggle</button>
</div>
LIVEDEMO
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
