In Angular 18, I see you pass the data back to the resolver and the page can load the data. However, on ‘MOST’ all calls, something like this is going on storing the data into something like a ReplaySubject or other ->
async fetch(): Promise<UserData> {
const email = this._singleModel.getUserEmail();
const request = new FetchUserRequest();
request.email = email;
const response = await this._baseClient.fetchUser(request);
const userData = convert(response.user);
this.setUser(userData);
return userData;
}
setUser calls this._user.next(value); and _user is declared like so
private _user: ReplaySubject<UserData> = new ReplaySubject<UserData>(1);
I find the storage of the data into ReplaySubject MOST useful where as my application evolves, I can tie any new components to read from there if things change. Returning any data to the resolver for the resolver to store feels a bit off, BUT I am probably missing something and so my question exists. Do I let the resolver store state or do I store the state?
I also prefer the strong typed this.setUser(data) vs. returning to a resolver.
I am thinking of having my resolver just look like this in every case
@Injectable({
providedIn: 'root'
})
export class UserResolverService implements Resolve<any> {
private _userService = inject(UserService);
resolve(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<any> {
const promise = this._userService.fetch().then((res) => { return null; });
return from(promise); //convert promise to observable
}
}
I tried the above things.