扩展Type新增属性失效，求语法错误排查及实现方法

一、初始示例代码的语法错误及修正 #

1. 类型定义与赋值混淆 #

你写的const dialogData: DialogData = {a: string, b: string, c: string}是错误的——string是类型标识，不能直接作为对象属性值。正确流程是先定义类型，再赋值符合类型的具体值：

// 先定义DialogData类型
interface DialogData {
  a: string;
  b: string;
  c: string;
}
// 赋值符合类型规则的对象
const dialogData: DialogData = {
  a: "valA",
  b: "valB",
  c: "valC"
};

2. 数组定义语法错误 #

const myData: DialogData[{a:0, b:1, c:2}, {a:3, b:4, c:5}]完全不符合TypeScript语法，正确的数组定义需要指定数组类型DialogData[]，并用[]包裹元素：

// 注意：如果DialogData的属性是string类型，值要写字符串（若需数字类型则修改DialogData定义）
const myData: DialogData[] = [
  {a: "0", b: "1", c: "2"},
  {a: "3", b: "4", c: "5"}
];

3. 扩展数组元素的语法错误 #

[...myData, d: 100]的写法错误，你需要给数组内的每个DialogData对象添加d属性，而非给数组本身加属性。结合“d复制c的取值”的需求，应使用map遍历扩展每个元素：

export type ExtendedDialogData = DialogData & {
  d: number;
};
// 遍历每个元素，将c的值转成数字赋值给d
const myExtendedData: ExtendedDialogData[] = myData.map(el => ({
  ...el,
  d: Number(el.c)
}));

二、实际Angular代码的问题及修正 #

1. 语法拼写错误 #

launchModal方法中代码末尾多了一个[，修正后：

public launchModal() {
  const orders: EditableDataModel[] = [...this.selectedOrders.map(el => ({...el, sharesToMove: el.shares}))];
}

2. 类型匹配问题 #

从你console.log的输出{title: 'my title', orders: 1556}来看，存在类型不匹配的可能：

• 确认MyDataModel是否包含shares属性，且该属性类型为MyDataModel[]，否则sharesToMove: el.shares会不符合EditableDataModel的类型要求；
• 检查this.selectedOrders的类型是否为MyDataModel[]，若不是需先做类型转换或调整映射逻辑。

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