Pass parameter in component

I have a component where I make the instance of it in four pages, which are steps to a register. At each step, the ball becomes colored (use an active class) according to the page I am on. See the image below:


How can I pass by parameter the active class that paints the ball, according to the page I am?

I guess you could use @Input()


   select: 'my-component'
export class MyComponent {
     @Input() step: string;

your calling html (where you use your component):

 <my-component [step]="'thevalueyouwant'"></my-component>


<my-component [step]="yourVariable"></my-component>

Is that what you are looking for or I didn’t understood your question?

P.S.: Just found that explaining and demo