Can't set signal from within async piped Observable

980 Views Asked by At

When I try setting a signal value from within an Observable that gets piped to async, I get the error:

Error: NG0600: Writing to signals is not allowed in a computed or an effect by default. Use allowSignalWrites in the CreateEffectOptions to enable this inside effects.

But I'm not inside a computed or an effect, I'm inside an Observable. I also only get this through the async pipe; if I subscribe to the Observable and set my data in the next handler, it works as expected. Is this by design, or is it a bug?

refreshTrigger = new BehaviorSubject<void>(undefined);
refreshing = signal(false);
data = this.refreshTrigger.pipe(
  tap(() => {
    console.log("Refreshing");
    this.refreshing.set(true);
  }),
  map(() => "Doing real work here"),
  shareReplay(1)
);
{{refreshing() ? "Refreshing" : "Not refreshing"}} {{data | async}}

1

There are 1 best solutions below

3
Chellappan வ On

Update

 The bug has been fixed in the Angular 16.1.0-next.3.

It works fine when you make the observable asynchronous, as mentioned by @matthieu-riegler on GitHub.

You can workaround this issue by adding rxjs delay operator

data = this.refreshTrigger.pipe(
    delay(1),
    tap(() => {
      console.log('Refreshing');
      this.refreshing.set(true);
      return 'hello';
    }),
    shareReplay(1)
);