CODEWITHSUNDEEP
angularrxjssignalsngrx
Maxime
Maxime

Reputation: 190

Chain rxMethods with NGRX & signals

The Ngrx last update offers support for Angular signals.

I’m looking for a way to chain rxMethods with NGRX & signals.

Firstly I thought of chaining them directly in the store statement.

However I was not able to figure out how this can be done, nor if it’s the right thing to do.

I would be grateful if someone knows how to perform such synchronous calls.

export const BookStore = signalStore(
    {providedIn: 'root'},
    withState(initialState),
    withMethods((store, bookService = inject(BookService)) => ({
        loadRandomAuthor: rxMethod<number>(
            pipe(
                switchMap(() => {
                    return bookService.getRandomAuthor().pipe(
                        tap({
                            next: (author: Author) => {
                                patchState(store, {author});
                                // 👉 call loadBooksByAuthorId method with author.id here
                            },
                        })
                    );
                })
            )
        ),
        // 👉 here is the method to be synchronously called
        loadBooksByAuthorId: rxMethod<number>(
            pipe(
                switchMap((authorId: number) => {
                    return bookService.getBooksByAuthorId(authorId).pipe(
                        tap({
                            next: (books: Book[]) => {
                                patchState(store, {books});
                            },
                        })
                    );
                })
            )
        )
    }))
);

Upvotes: 2

Views: 3020

Answers (2)

Mykola Reheda
Mykola Reheda

Reputation: 1

To access the loadBooksByAuthorId() method, you can simply declare another withMethods() under the existing one and implement the loadRandomAuthor() method inside it. In this case, your store will already have the loadBooksByAuthorId() method and you can call it from the second withMethods().

But there is another option. Take a look at this solution: https://github.com/ngrx/platform/issues/4182

Upvotes: 0

user680786
user680786

Reputation:

HTTP requests are asynchronous. What you meant is consequent.

Calling one effect from another is a code smell.

I recommend this way: loadRandomAuthor() should set authorId in the state, and loadBooksByAuthorId() should observe authorId in the state and load books when that id is changed.

Your loadRandomAuthor() already sets author, so loadBooksByAuthorId() should observe state.author.id.

Upvotes: 2

Related Questions