Arthurofos’ suggestion to use the Location service seems to be relevant, as it can be used to navigate back to the view you were in prior to routing to a new component.

Of course, while there are very Javacsripty-ways to do these sort of things, it’s always recommended to use Angular’s libraries, if such an alternative exists.

In our case, it does, and it presents itself as the ‘Location’ service you can inject into your component.

import { Location } from '@angular/common';

@Component({
  // Other component info
  providers: [Location, {provide: LocationStrategy, useClass: PathLocationStrategy}]
})
export class TestComponent {
   constructor(private location: Location, // Other constructor arguments) { }

   public goBack() { 
      this.location.back()
   }
}

https://alligator.io/angular/location-service/

Something like that should work:
routerLink=”../”

But you can solve this problem in an elegant way thanks to the location of the library. Check out this post: enter link description here

In my Angular 8 project, I currently have a landing page (template-table.component) that shows a list of items that can be filtered and sorted. The filter and sort are added to the route queryParams(ex: “/template-table?name=another&type=Type%201”). If you select an item in the list, you will be taken to another route (that has the template-details.component) that has more details on that item. This details page will have a ‘back to list’ button that should take the user back to their previous list page.

Since I want the user to be taken back to the list with the filter params they were previously using, I can’t simply go to the route of that component, instead I want to go back in history (like how the browser back button works). So, how do I set an element to link to what the browser back button would be link to?

So, this is the bare minimum of my template-detail.component.html:

<h1>template-details works!</h1>
<div>{{template}}</div>
<div>{{id}}</div>
<div><a routerLink="/template-table/">Return to list page</a></div>

I think I also would like to check the route to see if it’s the template-table component route with query params, and not an unrelated route. (So, the route would need to be like: “/template-table?params=xxx”, and couldn’t be “google.com”. If the browser back button isn’t related to the template-table, then it should go to “/template-table” without any params (or maybe my 404 page.)

The basic functionality that I’m wanting to achieve is for the user to be able to filter a list, go to another route with more info on a list item, and then return to the list with the same filters they previously added. If there would be a better way to do this than by trying to access the browser’s back button, I’d love to hear about it.

Thank you for any assistance you can provide.