Angular添加任务报TS2345错误：Task类型缺少必填id属性怎么办？

问题原因 #

你定义的Task接口强制要求id为必填的数字类型属性，但你在onSubmit方法中构建newTask对象时没有传入id字段，触发了TypeScript的类型校验报错。

解决方案 #

可根据你的项目业务逻辑二选一：

方案1：前端生成ID（纯前端管理任务数据场景适用） #

直接在构造新任务对象时生成唯一ID即可，简单场景可以直接用时间戳实现，修改add-task.component.ts中onSubmit方法的newTask构造代码：

const newTask = {
  id: Date.now(), // 时间戳天然唯一，小项目直接用足够
  text: this.text,
  day: this.day,
  reminder: this.reminder,
};

如果你的任务存在已有列表，也可以取现有任务的最大ID值加1作为新ID，逻辑同样可行。

方案2：将ID设为可选属性（ID由后端生成场景适用） #

如果任务ID是提交到后端后由数据库自动生成，前端提交新任务时不需要传递ID，直接修改Task.ts的接口定义，将id标记为可选属性即可：

export interface Task{
    id?: number; // 问号表示该属性为非必填项
    text: string;
    day: string;
    reminder: boolean;
}

注意选用该方案时，后续代码中用到Task类型对象的id属性的位置，需要做好非空判断，避免运行时报错。

内容的提问来源于stack exchange，提问作者PaSiYa