[v19] Frozen state throws error when using state as ngComponentOutlet items

[spock123]

Which @ngrx/* package(s) are the source of the bug?

signals

Minimal reproduction of the bug/regression with instructions

We are using SignalStore to load and contain a list of user defined widgets for a Dashboard.
The loaded widgets are used to then dynamically instantiate the chosen implementations.

However, it seems that *ngComponentOutlet tries to modify the values, making Ngrx throw an exception in development mode.

We use it like this:

 @for (widget of store.widgets(); track widget.id) {
                <widget-container>
                    <ng-container
                        #widget
                        *ngComponentOutlet="widget.component; inputs: { slug }" />
                </widget-container>
            }

How can we avoid this - do we really need to do a deep copy of the store values before using in the template?
Or is there a way to unfreeze a specific store?

Thanks

Expected behavior

Allow me to unfreeze state when absolutely needed

Versions of NgRx, Angular, Node, affected browser(s) and operating system(s)

Ngrx 19.0.0
Angular 19.0.5
MacOS (ARM)

Other information

No response

I would be willing to submit a PR to fix this issue

• Yes
• No

[markostanimirovic]

Hi @spock123,

You're most likely mutating the SignalStore state which is not allowed and causes the error - SignalStore state must be updated immutably. If that's not the case, please provide a reproduction via the Stackblitz playground or GitHub repo.

[spock123]

@markostanimirovic Could it not be that it is because I have component instances in the store, and that the use in ngComponentOutlet changes them? I'll try to work on this of course, and figure out the cause.

Thanks

[markostanimirovic]

Component instances should not be part of the state. In v19, you can define them as SignalStore properties:

export const MyStore = signalStore(
  withProps(() => ({
    widgets: [/* ... mutable widgets ... */]
  })),
);

Read more about the new base feature withProps at the following link: https://next.ngrx.io/guide/signals/signal-store/custom-store-properties