1

I have some text boxes and button in a page, while clicking on that button it should navigates to the another component, after completing all the functionalities in that page it should navigate back to the previous page with the previously entered data.

How could I do that in angular 8. Any suggestions.

Sowmiya B
  • 39
  • 1
  • 6
  • 1
    use behavior subject to persist data. Also refer this link https://stackoverflow.com/questions/39762485/want-to-prevent-component-recreation-while-routing-in-angular-2 – LogicBlower Mar 22 '21 at 10:49
  • 1
    How are you navigating back? Do you use `{ Router } from '@angular/router'` or `{Location} from '@angular/common'`? – ruth Mar 22 '21 at 11:15
  • Yes by using location i'm navigating to back, but in my case there are so many data fields needs to be filled with previously entered data. @MichaelD – Sowmiya B Mar 22 '21 at 11:49

1 Answers1

3

So granted you don't want to be committing any of that data to any kind of database at that point, I would suggest some sort of injectable state service.

@Injectable({
    providedIn: 'root'
})
export class FormStateService {
    private _formData: FormDataDto | null = null;
    
    public get formData() {
        return this._formData;
    }

    public set formData(form: FormDataDto | null) {
        this._formData = form;
    }
}

When clicking on the button that navigates to your other component, save the form data using the set method. When returning to the original component, use the get method to retrieve the form data.