پست با stable شدن API های Resource و httpResource برای مدیریت request‌ها، loading state و error state ها، برای component‌ها …

با stable شدن API های Resource و httpResource برای مدیریت request‌ها، loading state و error state ها، برای component‌ها و service‌ها خیلی کاربردی شده. ولی این API های جدید برای Router Guard و Resolver ها مناسب نیستن! حالا چرا؟ چون ذاتا Guard‌ها و Resolver‌ها تا مشخص شدن نتیجه شون Navigation رو متوقف میکنن، یعنی باید منتظر یه نتیجه ای مثل Boolean، Promise یا Observable بمونن. ولی Resource‌ها ذاتا Reactive هستن و وقتی داخل Resolver و یا Guard ازشون استفاده کنیم مقدار اولیه value شون معمولا undefined هست و request در وضعیت loading قرار داره و ما اگه همون لحظه بخوایم value شون رو استفاده کنیم اون Guard ممکنه سریعا مقدار false رو برگردونه و Navigation رو Cancel کنه حتی قبل از اینکه API اصلا جواب رو برگردونه! export const authGuard: CanActivateFn = () => { const authResource = httpResource<boolean>(() => ({ url: '/api/auth/status', })); // This returns the signal's current value synchronously // Which is `undefined` initially! return authResource.value() ?? false; }; حالا راه درست چیه؟ برای Guard و Resolver فعلا همچنان از HttpClient و Observable یا Promise استفاده میکنیم که بشه از Async بودن شون این بهره رو برد تا جواب حاصل نشده، نتیجه ای برگردونده نشه قبل از Navigation کامل. export const authGuard: CanActivateFn = () => { const http = inject(HttpClient); // An Observable cleanly blocks the Router until it completes or emits return http.get<boolean>('/api/auth/status'); }; پس برای جمع‌بندی در حال حاضر Resource و httpResource برای UI و Reactive Data عالی هستن، اما برای Guard و Resolver درست هست که از همون روش‌های فعلی Observable و Promise استفاده کنیم. در واقع Resource برای Data binding استفاده بشه و Observable و Promise برای Control flow در Routing پروژه. #angularsignal #angularcafe