Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Rxjs - check if Observable is empty, without subscribing to it

I wonder is it possible to check if observable received any value. And I want this without subscribing to it, because I am too lazy to overwrite my current code. Problem is that I create observable in parent component and then passing it to child components. And I need only one tiny thing from it, so subscribing just for that, seems unnecessary...

parent-component:

adverts$: Observable<advert[]>;
    
ngOnInit() {
    this.adverts$ = this.advertService.advertsPerUser();

service:

advertsPerUser() {
    return this.advertsKeysPerUser()
        .map(adKeys => adKeys.map(adKey => this.afDb.object('adverts/' + adKey.$key )))
        .flatMap(val => Observable.combineLatest(val) );
}

So my goal is in parent-component.html do something like:

<div *ngIf="adverts$"> 
like image 211
Julius Dzidzevičius Avatar asked Sep 19 '17 17:09

Julius Dzidzevičius


People also ask

How do you check if an observable is empty?

The RxJS isEmpty() operator returns an observable with a Boolean value indicating whether the observable was empty or not. It returns an output as true if the source observable is empty; otherwise, false.

Do you have to subscribe to an observable?

Observables are declarative —that is, you define a function for publishing values, but it is not executed until a consumer subscribes to it. The subscribed consumer then receives notifications until the function completes, or until they unsubscribe.

Does completing an observable unsubscribe?

A fundamental aspect of observables is that when they complete, any subscriptions are automatically unsubscribed. As such, if you know an observable will complete then you do not need to worry about cleaning up any subscriptions.


4 Answers

I had a similar issue where i wanted to check if my response, which is an array of a custom type, was empty or not. Here is my solution

<div *ngIf="(response$ | async).length == 0">
    <p>no results</p>
</div>
like image 141
Deitsch Avatar answered Oct 14 '22 14:10

Deitsch


You can use defaultIfEmpty operator to define some default value in case if the source observable is empty.

like image 29
sbarlabanov Avatar answered Oct 14 '22 13:10

sbarlabanov


You can try using defaultIfEmpty operator (see description). Supposed your advertsPerUser return a number you could do this:

this.adverts$ = this.advertService.advertsPerUser().map(count => count > 0).defaultIfEmpty(false);

in html:

<div *ngIf="adverts$ | async">

or with rxjs version 6:

this.adverts$ = this.advertService.advertsPerUser().pipe(
    map(count => count > 0),
    defaultIfEmpty(false)
);
like image 36
fredfred Avatar answered Oct 14 '22 15:10

fredfred


In short, no.

By default Observable is unicast behaves similar to function, so emits value to observer once it is actually subscribed. It is important it is similar to function, subscribing is actual attempt to start those observables. If you think of typical function returns a value (or not), you won't be able to know until function is actually executes and returns its results. Same applies for Observable as well you can't have source's values until you subscribe it.

like image 45
OJ Kwon Avatar answered Oct 14 '22 14:10

OJ Kwon