Question

我尝试以角度方式将数据从一个组件传递到另一个组件，第二个组件显示为“材料”对话框。在传递对象之前，它的行为与预期的一样，但是当我传递它时，除了第一个属性之外，我都无法访问所有内容。

传球课程：

displayDetail(i) {
     let dialogRef = this.dialog.open(PartDetailComponent, {
     width: '90%',
     data: { part: this.partList.find(x => x.partNumber = i) , id: i }
   });

   dialogRef.afterClosed().subscribe(result => {
   console.log('The dialog was closed');
  });
}

接收班

constructor(public dialogRef: MatDialogRef<PartDetailComponent>,
    @Inject(MAT_DIALOG_DATA) public data: Part) {
    if (data == undefined) {
      console.log("Bad data.  Closing modal.")
    }
    else {
      this.part = data;
      console.log(data);  // object now only has id
      console.log(this.part); // identical to data
      console.log(this.part.id); // displays id
      console.log(this.part.description); // undefined
      console.log(data.description); // undefined
    }
}

我是角色的新手，有点像打字稿的新手，但这似乎不应该发生。到底是怎么回事？

编辑：如果Part类是相关的：

export class Part {
  id: number; // assuming there's an ID unique of partNumber or sku
  title: string;
  partNumber: number;
  description: string;
  leadTime: number; 
  weight: number;
  sku: number;
  pictureUrl: string;
  inventory: number;
  inStock: boolean;
  isOrderable: boolean;
  instructions: string;
}

Answer 1

记录这个，因为我觉得有关角度事物的文档太少，这是一个有趣的问题。

冲突发生在我传递的是什么样的物体和我接收的物体之间。

我发送了：

data: { part: this.partList.find(x => x.partNumber = i) , id: i }

这显然是一个包含部分和id的对象。

我试图收到一个部分：

constructor(public dialogRef: MatDialogRef<PartDetailComponent>,
@Inject(MAT_DIALOG_DATA) public data: Part) {

所以当我将接收对象更改为任何对象时，我就可以访问data.part并正确使用它。

constructor(public dialogRef: MatDialogRef<PartDetailComponent>,
@Inject(MAT_DIALOG_DATA) public data: any) {

这更像是一个转换问题，因为没有组件间类型检查（就像大多数情况下会像C＃这样的编译语言）。对于彼此连接的组件可能正在通过“错误”，转发器不会检查，也不关心它们。一种数据和javascript就可以用它收到的东西做它能做的事情。

复制后无法检索对象属性

1 个答案: