title: angular 5 before route from one component to another how to save component form data
body: <p>I am trying to route one component to another; each component has some form data (<code>this.formBuilder.group</code>). while I navigate from one component to another, if I come back to the previous component, the filled data is not restored.</p>
  
  <p>Is that any way to save the data before routing for each component? Is there any lifecycle method is there to detect before leaving the component to save all form data?</p>
  
  <pre><code>navigation.ts:
      if(currentNav == "Personal Details"){
        this.router.navigateByUrl('/understand/personal');
      } else if(currentNav == "Contact Details"){
        this.router.navigateByUrl('/understand/contact');
      }
  
  contact.ts
  ngOnInit() {
      this.contactDetails = this.formBuilder.group({
        email: ['', [Validators.required, Validators.email]],
        mobileNumber: ['', Validators.required],
        secondaryNumber: ['', Validators.required]
     });
    }
  
  personal.ts
      this.personalDetails = this.formBuilder.group({
        country: ['', Validators.required],
        countryOfIssue: ['', Validators.required],
        countryOfBirth: ['', Validators.required]
         });
        }
  </code></pre>