CODEWITHSUNDEEP
angulartypescriptngrxngrx-store
Jamie Bohanna
Jamie Bohanna

Reputation: 560

Object cannot be reset after sending object to NgRx Store

I have a template driven form in my Angular 8 project.

This form uses NgModel to get the data on the click of a button which fires off a function to send that data, along with a few other pre-set values into an Action to send a message via an email service.

The Object:

  // Data for the reply
  public messageResponse = {
  transmissionRequest: {
    arrivalTime: null,
    attachments: [
      {
        contents: null,
        filename: null
      }
    ],
    ccRecipients: null,
    direction: 'OUTBOUND',
    originator: null,
    payload: null,
    recipient: null,
    subject: null,
    type: 'email'
  }
};

The attempted change:

this.messageResponse.transmissionRequest.payload = '';

The action that is dispatched with the message:

this.store.dispatch(new SendReply(this.messageResponse));

I have attempted to change the payload back to an empty string directly after the store dispatch, in a function after the store dispatch, on subscription of the store's success for that message actually being sent via http, and all of these solutions present the following error:

ERROR TypeError: Cannot assign to read only property 'payload' of object '[object Object]'

When I comment out the dispatch function, the payload is able to be changed successfully, with no error.

I am not mutating the store, as I know that cannot be changed. I am only trying to change the data displayed in the view after the message has been sent.

Does dispatching to the store change the permissions of the original object?

How do I get around this?

Upvotes: 0

Views: 258

Answers (2)

Jamie Bohanna
Jamie Bohanna

Reputation: 560

Creating a new object based off of the old object fixed this.

Upvotes: 0

timdeschryver
timdeschryver

Reputation: 15505

Actions are immutable, NgRx has runtime checks that freezes actions when they get dispatched. Because the object is frozen, you have this error.

See the docs for more info, https://ngrx.io/guide/store/configuration/runtime-checks#strictactionimmutability

Upvotes: 0

Related Questions