Javascript 无法更改从API获取的数据，错误：无法分配给只读属性

我通过API调用获取一些数据

 getPosts(postRequest: PostRequest): void {    
    this._postService.getPosts(postRequest).subscribe(result => {    
      const postList = result as PostList
      this.posts = postList.posts    
    });    
  }

main-browser.min.js:2 ERROR TypeError: Cannot assign to read only property 'up' of object '[object Object]'
    at PostListComponent.incrementVote (main-browser.min.js:34)
    at PostListComponent.vote (main-browser.min.js:34)
    at Object.handleEvent (main-browser.min.js:54)
    at Object.handleEvent (main-browser.min.js:6)
    at Object.handleEvent (main-browser.min.js:7)
    at dispatchEvent (main-browser.min.js:5)
    at main-browser.min.js:5
    at HTMLButtonElement.<anonymous> (main-browser.min.js:21)
    at ZoneDelegate.invokeTask (main-browser.min.js:67)
    at Object.onInvokeTask (main-browser.min.js:3)

this.posts包含一个post对象的数组。 在这种情况下，如下所示：

{
    id: 123
    rating: {
      datetime: 1496782640,
      down:0,
      hot:8061.5151856,
      id:344,
      up:2
    }
}

稍后我想更改项目

  incrementVote(post: Post) {
      post.rating.up++;        
  }

错误：

 getPosts(postRequest: PostRequest): void {    
    this._postService.getPosts(postRequest).subscribe(result => {    
      const postList = result as PostList
      this.posts = postList.posts    
    });    
  }

main-browser.min.js:2 ERROR TypeError: Cannot assign to read only property 'up' of object '[object Object]'
    at PostListComponent.incrementVote (main-browser.min.js:34)
    at PostListComponent.vote (main-browser.min.js:34)
    at Object.handleEvent (main-browser.min.js:54)
    at Object.handleEvent (main-browser.min.js:6)
    at Object.handleEvent (main-browser.min.js:7)
    at dispatchEvent (main-browser.min.js:5)
    at main-browser.min.js:5
    at HTMLButtonElement.<anonymous> (main-browser.min.js:21)
    at ZoneDelegate.invokeTask (main-browser.min.js:67)
    at Object.onInvokeTask (main-browser.min.js:3)

main browser.min.js:2错误类型错误：无法分配给对象“[object object]”的只读属性“up”
在PostListComponent.incrementVote（主浏览器.min.js:34）
在PostListComponent.vote（主浏览器.min.js:34）
在Object.handleEvent（主浏览器.min.js:54）
位于Object.handleEvent（主浏览器.min.js:6）
位于Object.handleEvent（主浏览器.min.js:7）
在dispatchEvent（主浏览器.min.js:5）
在主浏览器中。min.js:5
在HTMLButtoneElement。（主浏览器.min.js:21）
在ZoneDelegate.invokeTask（主浏览器.min.js:67）
在Object.onInvokeTask（主浏览器.min.js:3）

为什么this.posts对象是只读的

这似乎突然发生，代码没有任何更改。我在另一个项目中也遇到了同样的问题，如果我使用--aot编译，而不是在dev模式下编译，它就会工作

我怎样才能解决这个问题？我需要能够更改API中的值。为什么会发生这种情况

另外，该对象也用于HTML中，如下所示：

 <div class="row" *ngFor="let post of posts; let postIndex = index">
      <div class="col-md-12">

        <app-post [post]="post" [fontSize]="30"></app-post>

---

好的，尝试不递增，而是赋值。例如：

incrementVote(post: Post) {
      let newVal = post.rating.up + 1;
      post.rating.up = newVal;        
  }

可能已使用以下选项之一创建了

post

对象：

表示已创建为只读的

我发现用另一个对象替换该值是可行的。但我不确定它是否适用于你的情况

更新：

另一种解决方案是实际强制属性可写，例如：

up: {
    value: 2,
    writable: true
},

---

我想我找到了只读属性的原因。似乎是因为ngrx/存储库。我一使用

    this._store.dispatch({
           type: EVENT_X,
           payload: new EventPayload({
             variable: Something
           })
     });

---

变量“Something”变为只读。这是有意义的，因为它并不意味着可以直接使用ngrx/store进行更改

仍然存在同样的问题，没有尝试添加“writable”，但不能对每个对象都这样做。@ganjan考虑使用它，您可以创建一个类

PostClass

，该类具有X个属性

writable

。然后你只需举例，这样你就不用做1000次，就一次。没有？也尝试设置为可写，没有任何区别。