Question

我实际上正在使用* ngFor重复一个选择器而且我还要向子组件发送一些数据请看下面的代码：

<app-piegraph *ngFor="let studentData of studentData" [studentData]="studentData"></app-piegraph>

父组件：

studentData = {first: "harish",second: "santhu"}

子组件：

export class PiegraphComponent implements OnInit{
  @Input('studentData') testObj;
constructor(){
console.log(this.testObj); //Getting undefined error message here
}
}

我的studentData中只有一个对象因此我不想重复数据，我只是想将studentData对象发送到我的子组件而不使用* ngFor

这可能吗？

Answer 1

由于您的studentData是一个数组，并且您确定它只有一个对象，您可以这样做：

<app-piegraph [studentData]="studentData[0]"></app-piegraph>

这里我们需要记住在父组件中初始化数组，这样我们就不会在数组上出现undefined错误。

此外，您正尝试在构造函数中控制日志{child}中的@Input值，此时@Input值尚不可用。这可以通过将控制台日志移动到OnInit：

来解决

export class PiegraphComponent implements OnInit{
  @Input('studentData') testObj;

  constructor(){ }

  ngOnInit() { 
    console.log(this.testObj);
  }
}

如何在不使用角度5的* ngFor的情况下将数据从父组件发送到子组件

1 个答案: