RxJS - Test for empty Observable array

Question

I am learning Angular 2 and RxJS at the moment and feel that this is probably the simplest question there is. I am using the Store to save 'users' to. I want to test to see if this is empty or not from the Typescript side rather than in the Angular template.

Below are the pertinent lines of code.

public users: Observable<User[]>;
public store: Store<AppState>;

this.users = this.store.select(state => state.user);

if(!this.users) {
//DO THIS 
}

I have tried length, == null, == undefined and can't find how to test for this seemingly basic state. Any help appreciated.

Note that saving and retrieving users to the store is working correctly.

this.users is observable. It is potentially asynchronous. It can't be used as if(!this.users) .... It should be this.users.subscribe(users => { if (!users.length) ... }). — Estus Flask
– Estus Flask, Commented Oct 11, 2016 at 22:26

BeetleJuice · Accepted Answer · 2016-10-12 17:24:10Z

2

Assuming the Store works as you indicate, it returns an Observable. So what you receive (this.users) is not actually the store value, but rather a stream that will output that value.

As a consequence, to test whether the value is empty, you don't test the stream itself. Rather, you subscribe to the stream and observe what comes out:

public users: User[];

// subscribing will actually trigger the fetch for user data
this.store.select(state => state.user)
          .subscribe(data => this.onUsersEmitted(data));

// executed once user data arrives from the store
public onUsersEmitted(data:User[]){
    this.users = data;
    if(!data || !data.length){ /*empty data arrived*/}
}

edited Oct 12, 2016 at 17:24

answered Oct 12, 2016 at 4:15

BeetleJuice

41.1k24 gold badges120 silver badges181 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Billyhomebase Over a year ago

Thanks that's great. Clearly need to get to grips with Observables rather better. One point is that the if clause did not work. On inspecting Data was an empty array. I used this which worked. if(this.users.length==0){

BeetleJuice Over a year ago

@Billyhomebase thanks for the feedback. Updated my answer with what I'd do

Collectives™ on Stack Overflow

RxJS - Test for empty Observable array

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related