I am binding an observable to my Angular template and having conditional binding to show 'loading..' message till async pipe resolves the data.
The binding works fine and i am getting the data and the 'loading..' message getting triggered till i get the data.
<div *ngIf=" (combinedResult$ | async ) as favData ;else loading">
<p> {{ Binding Goes here}} </p>
</div>
<ng-template #loading>
loading...
</ng-template>
but if i change *ngIf by wrapping the result into "details:" object, then the if condition is not working and i could not see the 'loading..' message. ( But data is binding ).
<div *ngIf=" { details: (combinedResult$ | async ) } as favData
;else loading">
<p> {{ Binding Goes here}} </p>
</div>
What am i missing here..?
In this, *ngIf="{ details: (combinedResult$ | async ) } as favData; else loading"
{ details: (combinedResult$ | async ) }
always evaluates to true as it is not a condition but an assignment.
So it will never show the loading as the ngIf always evaluates to true