I am doing some api calls from my store and I have a catch error that triggers a modal with the error message when an error is thrown. The problem is that when this happens the method to trigger the modal is called but the html is not rendered until I click somewhere on the page. This only happens from within the store, I have simulated it over several parts of the app like this:

```
timer(5000)
      .pipe(
        mergeMap(() => {
          throw new Error('Some error');
        }),
      )
      .pipe(
        catchError((error) => {
          return this.handleError(_(`Couldn't do the thing`))(error);
        }),
      )
      .subscribe((result) => {
        console.log(result);
      });

```

I thought that I could inject the `ChangeDetectorRef` to trigger manual re-render of html but I got `NullInjectorError: No provider for ChangeDetectorRef!` and I can't make it work. My question is:

Is it possible to inject the `ChangeDetectorRef` in the store and would it solve my problem? Also, as a follow up question, is any other way to circumvent this issue? According to some things I have been reading it seems to happen due to the store being outside of Angular scope so it can't know that needs to re-render something.

Any help would be much appreciated.

UPDATE: [Here](https://stackblitz.com/edit/angular-ivy-zk9egm?file=src/app/app.component.ts) is a stackblitz illustrating the problem and a possible solution by dispatching an action to display the error message.