Keep state of previous page in Angular 10

Question

im reading data in component A, route to component B and pass data as extras. Component B now has this data in its instance scope. I then pass this data to component C and do something with that data. If I now return to component B by going back a page, the data which I received from A (my state) is not present anymore.

My question: How can I keep the state of B?

Answer 1

You can store your data in a shared service, as these are singleton classes, the data will persist until your application is destroyed.

@Injectable({
  providedIn: 'root',
})
export class MyService {
  data = '';
}

export class OneComponent implements OnInit {
  constructor(private myService: MyService){};

  ngOnInit(): void {
    this.myService.data = "I'm not going anywhere!"
  }
}