Typescript:不能分配给类型错误

Question

我是使用带有角度2的打字稿的新手.我正在使用角度2-cli的版本1.编译时,我收到此错误说"不能分配给类型Assignment []".我查看了数据类型,到目前为止它看起来还不错,但我不确定错误究竟是什么.谢谢你的帮助.

这是控制台错误的照片.

data.ts文件 - 这是数组中出现的两个项目

export const Assignments: Assignment[] = [
  {
    "a_type": "one",
    "a_title": "Assignment 1",
    "symbol": 1,
    "show": false,
    "tooltip": {
        "left": 82
    },
    "buttonPos":{
        "left": 130
    },
    "printTop": 0,
    "instructions": "Instructions here",
    "due_date": "sept-15.png",
    "percentage": "10.png",
    "taskA": {
        "name": "Option A",
        "a_title": "Task A",
        "information": "Instructions for task A",
        "selectA": true
    }
}, {
    "a_type": "two",
    "a_title": "Assignment 2",
    "symbol": 2,
    "show": false,
    "sub_a_title": "Assignment Information",
    "tooltip": {
        "left": 200
    },
    "buttonPos":{
        "left": 250
    },
    "printTop": 250,
    "instructions": "Instructions here",
    "due_date": "29.png",
    "percentage": "10.png",
    "taskA": {
      "a_title": "Assignment 2 info",
        "name": "Option A",
        "information": "Instructions for task A",
        "selectA": false
    },
    "taskB": {
      "a_title": "Assignment 2 info",
        "name": "Option B",
        "information": "Instructions for task B",
        "selectB": false
    }
}
]

assignment.ts - 这是数据类型

export class Assignment {
    a_type: string;
    a_title: string;
    symbol: any;
    show: boolean;
    tooltip: any;
    left: number;
    buttonPos:any;
    printTop: number;
    instructions: string;
    due_date: string;
    percentage: string;
    taskA: any;
    name: string;
    information: string;
    selectA: boolean;
    taskB: any;
    selectB: boolean;
  }

Answer 1

这是因为对象文字的Assignment结构与结构不匹配.

Typescript是结构化类型,这意味着如果要使用类型,则结构需要匹配类型.这意味着如果您想Assignment通过创建对象文字来创建,文字需要具有该类型中的所有属性.

我看错了几件事

1. 你错过了name,information因为它们嵌套在typeA.这不起作用,因为它们需要在主结构中,因为这是定义的Assignment

2. 你需要taskB在第一个对象中

3. 你失踪了selectA,selectB从对象的主要结构.

可能还有其他的东西,但希望你能明白这一点

如果要使选项可选,可以使用?运算符

interface Assignment {
  name?: string;
}

如果你想要嵌套,你也可以这样做

interface Assignment {
  taskA?: { name: string },
  taskB?: { name: string }
}