Angular2/Typescript/ngRx - TypeError：无法分配给对象的只读属性答案

【问题标题】：Angular2/Typescript/ngRx - TypeError: Cannot assign to read only property of objectAngular2/Typescript/ngRx - TypeError：无法分配给对象的只读属性
【发布时间】：2017-11-30 19:46:37
【问题描述】：

在构造函数中我做这样的事情

selectedDate: Object;
// construtor
this.selectedDate = {};
this.selectedDate['date'] = new Date();
this.selectedDate['pristine'] = new Date();

在另一个通过按钮单击调用的函数中，我执行以下操作：

this.selectedDate['date'] = new Date(this.selectedDate['pristine']);

我收到以下错误：

TypeError：无法分配给对象“[object Object]”的只读属性“date”

【问题讨论】：

你能显示onClick函数吗
你在使用 redux 吗？如果this.selectedDate 以某种方式放入动作负载中并分配给reducer 中的状态，则如果没有其他动作通过管道，您将无法直接修改它。
听起来你应该只定义类型而不是使用Object;那时您不妨使用any 并完成它。 IOW，使用selectedDate: { date: Date, pristine: Date }（或任何你的属性）。
@Ryan：是的，我正在使用 redux，现在我明白为什么我会看到这个问题。您的分析是正确的，谢谢！！

标签： javascript angular typescript redux ngrx

【解决方案1】：

@vikas 的回答让我走上了解决类似问题的正确轨道。

我正在尝试处理上传，我想在其中显示进度：
- 从UploadComponent，我向父级发出一个事件
- 父级向商店发送一个动作
- 一个效果捕捉到动作，调用服务上传文件（返回一个包含两个可观察对象的数组：progress$ 和 result$）
- 效果调度一个包含可观察对象的HttpProgress 动作

在这一点上，我遇到了类似的问题。在深入研究商店冻结代码后，我和一位同事发现它也深度冻结了action.payload。因此，将可观察结果传递到错误中，因为可观察状态在内部发生了变化。

我不使用有效负载将其保存到存储中，这样我就可以在我的组件中注册到 actions$，所以在这里我是否将可变对象传递到有效载荷。为了避免这个错误，我只是将 observable 包装到一个函数中，因为深度冻结不冻结函数。

【讨论】：

【解决方案2】：

感谢 Ryan Q：

正如 Ryan 评论的那样，我在我的应用程序中使用了 ngRx，我确实通过操作将 this.selectedDate 对象传递到了商店，因此我无法修改存储在状态中的对象。

解决这个问题的一种方法是传递一个新的对象引用，这应该可以解决问题：

this.store.dispatch(new settime.DateChangeAction(Object.assign({}, this.selectedDate)));

【讨论】：