Angular2 - 更改屬性 onClick 不會觸發視圖更新

Question

我正在嘗試在 Angular2 中重新創建TodoMvc 應用程序。

我正在努力根據點擊事件過濾列表。 代碼沙盒在這里

流程如下：

1. 應用程序使用this.todoItemFilter = TodoItemFilter.All和*ngFor="let item of todoItems | filter: filterTodoItems"
2. 單擊All/Active/Completed會導致 function 調用setSelectedFilter(todoItemFilterEnum.All)更新過濾器屬性this.todoItemFilter = filter; 但視圖不會重新渲染。

我很確定有多種方法可以解決這個問題，我實際上對盡可能多的人感興趣，謝謝！

Answer 1

您可以設置對 todoItems 的新引用：

  setSelectedFilter(filter: TodoItemFilter) {
      this.todoItemFilter = filter;
      this.todoItems = [...this.todoItems];
  }

這將導致更改檢測檢測到“新”值。