AngularJS学习之TodoMVC案例（二）2020-10-09

---

1.输入状态下 esc 取消编辑

handleEditKeyUp(e) {
    const {keyCode, target} = e;
    if (keyCode === 27) {
      // 取消编辑
      // 同时把文本框的值恢复为原来的值，按ESC
      target.value = this.currentEditing.title;
      this.currentEditing = null;
    }
  }

---

2.显示所有未完成项目数

 // get访问器
  get remaningCount() {
    // 剩余任务=所有任务（未完成）
    return this.todos.filter(t => !t.done).length;
  }
}

---

3.清除所有已完成任务

// get访问器
  get remaningCount() {
    // 剩余任务=所有任务（未完成）
    return this.todos.filter(t => !t.done).length;
  }

  // 清除所有已完成任务项
  // filter（过滤器）:从数组中过滤出需要的项,放入新的数组并返回这个新数组
  // this.todos重新赋值成未完成，已完成的就被过滤了
  clearAllDone() {
    this.todos = this.todos.filter(t => !t.done);
  }

点击Clear completed后

---

袁同学——2020年10月9日