CODEWITHSUNDEEP
angularangular4-formsangular4-router
Tarnjeet Singh
Tarnjeet Singh

Reputation: 896

How to refresh a component on routing change when on the same component?

I am working on an angular 4 project and stuck in the following situation:

I have a two step booking form that is used for booking an appointment. I have two different industries lets say Industry A and Industry B, now when I am doing a booking lets say for industry A and go to step 2 and suppose I click other industry B(accessible by side menu) I am still stuck at step 2, I would like the page to be reloaded to step 1, so in short I want to access the same component with different routings.

In technical language, Am on a component and I want to refresh same component when routing is change. If anyone know about please let me know. Thanks in advance!

Upvotes: 3

Views: 4929

Answers (2)

Runali
Runali

Reputation: 342

Try this may it solves your problem

import { ActivatedRoute } from  '@angular/router';

export class xyz {
   constructor (private activatedRoute: ActivatedRoute) {

   }

   ngOnInit() {
       // calls form when route parms change,
       // the method calls when your route params will change
       this.activatedRoute.params.subscribe (res => {
          this.validateForm();
       }    
   }

   // build form
   validateForm () {

   }
}

Upvotes: 5

andrea06590
andrea06590

Reputation: 1299

Hello this is a design problem : simply create a Map object with the status for each company like this : formProgress[company][step] then check the values on route changes. Then in your HTML create a form and all the steps as individual components so that on each HTML tag you can use something like <div *ngIf="step===2">

For route changes detection simply compare window.href.location or the previous route in a variable, with activatedRoute params (this step needs you to learn more on routing)

Upvotes: 0

Related Questions