Question

我确信这有一个合理的解释，但我真的很困惑，为什么在视图中更新对象属性，但原始类型的变量不是。我正在使用来自ngrx / store的observable，所以这可能就是原因，但我觉得我在其他异步情况下已经看过这个，所以我试图理解它。

例如，我有这个模板：

 <h1>{{data.counter}}</h1>
 <h1>{{dataCounter}}</h1>

然后在我的TypeScript类中，我有类似的东西：

ngOnInit() {
  this.store.select('mainStoreReducer')
    .subscribe((data: MyState) => {
      this.zone.run(() => {
      this.dataCounter = data.counter;
      this.data = data;
    });
}

当我查看屏幕时，不会更新代表dataCounter变量的文本，但会更新代表data.counter的文本！即使是强制zone.js运行的额外块也无济于事。 dataCounter仍然显示原始文本（注意：实际发生的是dataCounter获取初始状态的值，但是在以后触发订阅时它永远不会更新.data.counter的文本总是更新）。有人可以解释一下吗？

以下是我所描述的情况的一个问题： https://plnkr.co/edit/gEeAKK31Yo6kATjFQY08?p=templates

Answer 1

您可以注意到在调度事件CHANGE_STUFF

后未执行订阅处理程序

data.counter正在更新，因为在mainStoreReducer内部您改变了此对象，而不是创建新对象。

这是你出错的地方：

let newState = Object.assign(state);

它应该是：

let newState = Object.assign({}, state);

或更好的方式：

let newState = Object.assign({}, state, { counter: 13 });

<强> Plunker Example

为了更好地理解，请参阅Reducers文档

http://redux.js.org/docs/basics/Reducers.html

角度2变化检测不适用于.Subscribe（）回调中的基元？

1 个答案: