Question

无法分配给对象‘[object Object]’的只读属性‘selected’

2021-08-05

4860

angular typescript angular-material ngrx ngrx-store

我试图以编程方式取消选中我的复选框，但当我绑定到 ngrx 存储中的值时，我收到以下错误 无法分配给对象“[object Object]”的只读属性“selected” 这是我的视图

<ul>
    <li *ngFor="let language of languages">
      <div>
        <mat-checkbox [(ngModel)]="language.selected" color="primary">
          {{ language.value }}
        </mat-checkbox>
      </div>
    </li>
  </ul>

和我的 ts

    this.languagesSub = this.store.select(getCreateLanguagesLanguages).subscribe(res => this.languages = res);

为什么我无法绑定到 language.selected？

Answer 1

您放入存储中的每个对象都变为不可变的。这意味着，所有设置器都将被删除。这就是 NgRx 保持不变性的方式，这是一个核心概念：您永远不会改变对象，而是用“新版本”替换它。因此，为了使其工作，您需要分派一个操作并使用您的 Reducer 来处理它。仔细查看 NgRx 的“入门”。

Answer 2

如果您启用了严格模式，那么存储中的所有数据都是只读的。这意味着如果您想使用它们，您应该创建一个副本。

this.languagesSub = this.store.select(getCreateLanguagesLanguages)
  .subscribe(res => this.languages = res.map(l => ({...l})));
  // this will create a deep copy of all objects in languages array