How to handle errors in rxjs instead of try/catch?

Question

Originally, the error is handled as follows.

async getLists() {
  try {
    const list = await api.getList();
    list.filter() ....
  } catch(e) {
    console.log(e)
  }
}

How can I handle it using rxjs in the same situation?

I'm not familiar with rxjs, so I don't know if it's the answer, but the code I thought of is like this.

getLists() {
 from(api.getList()).subscribe(
   list => list.filter.....,
   e => console.log(e)
 )
}

I want to know how to handle all the errors that may occur when calling the API, such as try-catch, and the errors that may occur when processing the data received from the API after the API call.

Promises are being returned after API calls, but rxjs must be used If an error occurs, I want to unsubscribe.

for your code getlists seems to be returning a promise not observable. — Aakash Garg
– Aakash Garg, Commented May 18, 2022 at 15:42

ZombieChowder · Accepted Answer · 2022-05-18 15:46:59Z

0

So this should be a decent example of how to handle errors.

const getLists = getLists() {
 from(api.getList()).pipe(catchError(error => of(`Bad Promise: ${error}`))
}

//output: 'Bad Promise: Rejected'
const subscribe = getLists.subscribe(val => console.log(val));

This is based on your example. You need to handle a promise, not an observable. (as mentioned by @Aakash Garg).

answered May 18, 2022 at 15:46

ZombieChowder

1,19414 silver badges38 bronze badges

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

2 Comments

sjfklsaf Over a year ago

If this is done, const subscribe = getLists.subscribe(val => console.log(val))); how does this process handle errors that occur inside the subscribe function? @ZombieChowder

ZombieChowder Over a year ago

@sjfklsaf you can handle the errors however you want inside the subscribe function, in the given example we just log it with console.log(val). You can pass a function to do something else, or fire a logger or something. I suggest you read through the documentation I've linked in my answer.

Jose Vicente · Accepted Answer · 2022-05-18 15:49:43Z

0

You can use subscribe and handle subscribe error like this:

getLists() {
 api.getList().subscribe(response => {
   // do something with the response data
 },
 () => {
    console.log('Error text');
  })
}

let me know if it works for you.

answered May 18, 2022 at 15:49

Jose Vicente

19710 bronze badges

Comments

Rohan Kadam · Accepted Answer · 2024-06-15 06:50:08Z

It seems your code is returning a promise, you can convert the promise to observable and subscribe to it as shown below.

If the API call is successful it will go to the next block and if any error occurs it will go to the error block.

Note :- defer allows you to create an Observable only when the Observer subscribes. It waits until an Observer subscribes to it.

defer docs - https://rxjs.dev/api/index/function/defer

const { defer, from } = require("rxjs")
    
    async function getLists() {
        return await fetch("https://jsonplaceholder.typicosde.com/users").then(response => response.json())
    }
    
    const observableFromPromiseFactory = defer(() => from(getLists()));
    
    observableFromPromiseFactory.subscribe({
        next: value => console.log(value),
        error: err => console.error('Error->: ', err),
        complete: () => console.log('Completed')
    });

Collectives™ on Stack Overflow

How to handle errors in rxjs instead of try/catch?

3 Answers 3

2 Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related