类型错误：无法读取未定义的属性(读取"fan")

Question

这是父组件模板文件。没有任何问题

app.component.html

<div>
<input type="text" [(ngModel)]="electronics.light" name="light" placeholder="light">
<input type="text" [(ngModel)]="electronics.fan" name="fan" placeholder="fan">

</div>
<button (click)="display();">Display</button>
<div *ngIf="flag">
<app-electronics-layout [images]="images" [electronicsObj]="electronics"></app-electronics-layout>
</div>

这是子组件文件的一部分，在单击按钮验证电子风扇值时调用display1()方法。

@Input()
electronicsObj!: electronics;
display1(){
console.log(this.electronics.fan);  //This is printing actual value input by user.
}
myConfigurations:ElectronicsInterface = {
fan: this.electronics.fan,     //this is giving TypeError
light: this.electronics.light
}


}

Answer 1

electronics没有被定义，当你试图访问它，所以你有这个错误。

为了确保在父类给出值后创建myConfigurations，你可以从setter中初始化它:

private _electronicsObj: electronics;
get electronicsObj() {
return this._electronicsObj;
}
@Input() set electronicsObj(electronicsObj: electronics) {
this._electronicsObj = electronicsObj;
this.myConfigurations = {
fan: electronicsObj.fan,
light: electronicsObj.light
}
}