ngxtension / ngxtension-platform

Utilities for Angular
https://ngxtension.netlify.app/
MIT License
544 stars 80 forks source link

derivedAsync with required input #366

Closed ArielGueta closed 1 month ago

ArielGueta commented 2 months ago

Hi

I have an issue with using derivedAsync and require input:


id = input.required<string>();
data = derivedAsync(() => this.service.get(this.id()), { requireSync: true })

The issue is that when you call the callback in the first time this.id() will be undefined.

sysmat commented 2 months ago

you should have some guard in closure func

data = derivedAsync(() => this.id() ? this.service.get(this.id(): null), { requireSync: true })
eneajaho commented 2 months ago

Hello @ArielGueta derivedAsync uses effect under the hood, and the effect will wait until all the inputs are set and then call the callback function.

The issue comes from requireSync that you have enabled. When you enable requireSync it will synchronously call the callback function and it won't use the effect scheduling (so it won't wait for your inputs).

So, this is working as expected.

Here's a repro: https://stackblitz.com/edit/stackblitz-starters-97u74t?file=src%2Fmain.ts