I know their are similar topics, but to my idea I do everything right. Also, I've done this already the same way in other parts of my project and it works fine. But in this case, my value doesn't get passed from parent to childcomponent. The value being passed is a number (from an id). The console logs in the parent component confirm that the id is present in the parent before sending.
parent component
export class AddConsignatiebonComponent implements OnInit {
modalRef: MdbModalRef<SigningPadComponent> | null = null;
constructor(private modalService: MdbModalService) { }
async ngOnInit(): Promise<void> {
// irrelevant methods
}
async consignatieBonToevoegenEnTekenen(){
console.log("consignatieBonToevoegenEnTekenen reached");
const passingID = await this.consignatieBonToevoegen();
console.log(passingID);
this.modalRef = this.modalService.open(SigningPadComponent,
{data: {passingID}, modalClass: 'modal-xl'});
async consignatieBonToevoegen():Promise<number> {
//function that returns the id
}
}
}
child component
export class SigningPadComponent implements OnInit {
@Input() data: string | undefined; //tried this one
passingId: number | null = null; // and this one, both give undefined
id!:number;
constructor(public modalRef: MdbModalRef<SigningPadComponent>) {}
ngOnInit(): void {
//this.id=this.passingId?
console.log("passingId: " + this.passingId);
console.log("data: " + this.data);
}
// other irrelevant functions
}
Can someone explain me why the id isn't getting transferred in my particular situation to the child component? In all my other code, it works just fine with the objects I transfer, but not with this number.
I made a typo. In my childComponent I wrote passingdId instead of passingID.