Html 获取错误类型错误：无法读取属性'；已完成'；未定义的

我目前正在构建一个待办事项列表，并添加一个包含单击事件的复选框，一旦该复选框被单击，它应该在输入的任务上具有删除线元素

HTML代码：

<ul class="list-group">
    <li *ngFor="let todo of todos; let i = index"
        class="list-group-item shadow p-3 mb-5 bg-white rounded border border-dark rounded" id="myTask">
        <div class="todo-item">
            <span class="todo-title" [ngClass]="{'todo-complete': todo.completed}">
                {{todo.task}} <input type="checkbox" class="todo-checkbox" (click)="completeItem()" />
                <button type="button" class="btn btn-danger" (click)="delete()">X</button>

            </span>
        </div>
        </li>

</ul> 

  addToDo(todo: string, cm?: boolean) {
    const td = {
      id: null,
      task: todo,
      completed: cm,
    }
    if (todo === '') {
      alert('You must enter in a task TO DO!')
    } else {
      this.todos.push(td);
    }
    this.saveItemsToLocalStorage(this.todos);
  }

  delete(index: number) {
    this.todos.splice(index, 1);
    console.log("index", index);
    this.saveItemsToLocalStorage(this.todos);
  }

  clear() {
    this.todos = [];
    console.log('index', this.todos)
    this.saveItemsToLocalStorage(this.todos);
  }

  completeItem() {
    this.update.emit({
      todo: this.todos,
      changes: {completed: !this.todo.completed},
    });

  }

---

在

completiteItem（）

函数中，您引用了一个

this.todo

，但我看不到在任何地方定义了它。你希望它是什么？用todo替换todo，现在已经修复了。谢谢你@MattU