How to negate an observable an set an alias in async pipe without losing the meaning?

Issue

This Content is from Stack Overflow. Question asked by Tabares

I have a flag in order to show the data that is using an angular class property, and the value is assigned throug a subscription in observable, but I want to update the approach using async pipe and an alias, the problem is that the validation requires to be false in order to be ready to show, this way I have to update the values in the input in order to render as expected. I don’t want to set the not operator to validate the response. What is the right form to provide an alias, avoiding the not operator from validate scenario when I have a multiples places that are using the alias?

Old approach with class property

    <app-navigation [isLoading]="!isDataLoading"><app-navigation>
    <app-list [isLoading]="!isDataLoading"><app-list>
    <app-spinner [isLoading]="isDataLoading"><app-spinner>

New approach with async pipe, I don’t want to modify the input property, but the alias is opposite when the validation is happening in the ng container

<ng-container *ngIf="(isDataLoading$ | async) === false as isDataLoading">
    <app-navigation [isLoading]="isDataLoading"><app-navigation>
    <app-list [isLoading]="isDataLoading"><app-list>
    <app-spinner [isLoading]="!isDataLoading"><app-spinner>
</ng-container>



Solution

Check the Answers

This Question and Answer are collected from stackoverflow and tested by JTuto community, is licensed under the terms of CC BY-SA 2.5. - CC BY-SA 3.0. - CC BY-SA 4.0.

people found this article helpful. What about you?