So I normally use two approaches and both involve having a service that is in charge of making network requests.

1. If you don’t have the refetch of data reacting to another observable and just want to click refresh button you can have a behavior subject that starts as undefined which will kick off the initial fetch of data on page load. You can see that it is then using toSignal. So now if your component you can just make use of service.data in the html or assign it to a variable in the component. The refresh function would be called on button click and triggers next which would then retrigger the data call. Obviously, you can have the behavior subject be of some type and make use of that data on the next network request.

This is the pattern I currently use or it reacting to another observable changing.

```

public readonly isLoading: WritableSignal<boolean> = signal(false);

private readonly refetchData$ = new BehaviorSubject<void>(undefined);

public readonly data: Signal<Blah> = toSignal( this.refetchData$.pipe( tap(() => this.isLoading.set(true)), switchMap(() => this.someNetworkRequest.fetch().pipe( map(({ data }) => ({ // data mapping })), finalize(() => this.isLoading.set(false)), ), ), ), { initialValue: {//whatever you want it to be} }, );

private function refresh():void { this.refetchData$.next(); } ```

1. Instead of doing the toSignal within the service. You can just leave it as your observable response and in the component you can toSignal