'Angular passing boolean value from parent Stepper to child step

I have an Angular Material stepper component with children steps. How can I pass the boolean value isNewProposal to the children? My usage of @Input() isn't working here as the boolean comes back undefined on the children, after being assigned true or false in the parent.

Parent Component:

<mat-horizontal-stepper [selectedIndex]=currentStepIndex [isNewProposal]="isNewProposal" (selectionChange)="selectionChanged($event)" [linear]="true" labelPosition="bottom">
        <mat-step [completed]="step.completed" *ngFor="let step of steps; let i = index" [label]="step.name">
            <router-outlet *ngIf="i === currentStepIndex"></router-outlet>
        </mat-step>
    </mat-horizontal-stepper>

  isNewProposal: boolean;

  async ngOnInit() {
   if (someCondition)) {
      this.isNewProposal= true;
    } else {
      this.isNewProposal= true;
    }
  }

Child component:

  @Input() isNewProposal;

  ngOnInit(): void {
    const invalidate = this.isNewProposal //always undefined;
  }

angular typescript

Solution 1:^[1]

Try using @Input() isNewProposal!: boolean | boolean;

and use it instead invalidate

Solution 2:^[2]

Try using OnChanges on your child component - that way you can be sure to only check the @Input()'s value once the parent has successfully proved a value

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution	Source
Solution 1	Filippo Brigati
Solution 2	CH4B

'Angular passing boolean value from parent Stepper to child step

Solution 1:[1]

Solution 2:[2]

Sources

Related Questions

Solution 1:^[1]

Solution 2:^[2]