How to access custom properties of a component within a flow

Community Training, Academy & Certifications
1

Hi Team,

I am working with the stepper component. I am trying use Next button’s onClick(pick a flow) property to set the Step’s custom property [completed]: isCompleted to true, so that it can navigate to next step only on Next button click.

image
image1837×774 55.6 KB

How do we access the “isCompleted” custom property here in the flow?

image
image1617×777 46.3 KB

Can you please guide me regarding this?

Thanks,
Lavanya S

2 Likes
2

Hi @LavanyaS ,

If you’d like to control the stepper using a button, you can add a custom property (Attribute) to the Stepper component itself (not on individual steps), as shown in the screenshot below.

image
image1526×571 43.2 KB

Once that’s configured, you can manage the step navigation through the button’s onClick flow using the following functions:

  • this.stepper.next(); → To move to the next step
  • this.stepper.previous(); → To go back to the previous step
  • this.stepper._selectedIndex; → To retrieve the current step index

These functions allow you to programmatically control the stepper’s behavior.

Let me know if anything is unclear.

7 Likes
3

Hi Shamnad,

Thank you for the solution. I will try this out.

2 Likes