0

I have 2 routes defined as homepage and page1. I am going to page1 from homepage by this.router.navigation(with some queryparams).Now once i go to page1, i have some filters,which i can add to get particular data from api.Once i add those filter i change the page1 url by this.router.navigation(with some queryparams).After adding/deleting multiple filter , my url changes many times..Now i have a back button which upon click should navigate me to Homepage.

1.I have tried using history.back/location.back.But i have to click multiple times.(i see that navigationstart gets called multiple times)

2.i have tried a solution using rxjs pairwise But i am not able to get the previous page(homepage). 3.This is just a situation.Basically i have to get the route of the preious page.I can't hard code the path in backFunc,Because this has to be generic for all of my other similar types of pages.I can come to page1 from any other page, and should be able to go back to the respective page. Am i missing something very obvious , does Angular 4 provides any way to tackle this?

Trinanjan Saha
  • 17
  • 1
  • 7
  • if your go back location is fixed then why not set the button href to home location? – Khairul Islam Feb 04 '18 at 16:42
  • Updated My question.I have just described the hypothetical case.Basically i have to get the previous route(from the page where i am coming) – Trinanjan Saha Feb 04 '18 at 16:45
  • 1
    with an easy search i got this from Stack Overflow! https://stackoverflow.com/questions/41038970/how-to-determine-previous-page-url-in-angular – Khairul Islam Feb 04 '18 at 16:48
  • Possible duplicate of [How to determine previous page URL in Angular?](https://stackoverflow.com/questions/41038970/how-to-determine-previous-page-url-in-angular) – Khairul Islam Feb 04 '18 at 16:49
  • Yes i have tried that solution using pairwise.Problem is as i am updating the url in page1 multiple times,everytime the observable value changes and as i am subscribed to that observable,the previousValue variable gets set to new value. – Trinanjan Saha Feb 04 '18 at 16:52

2 Answers2

0

I'm slightly confused by the question but it should be as simple as just navigating to the homepage by using router.navigate. Failing that, try using https://angular.io/api/common/Location service's back function.

Alan Smith
  • 1,069
  • 4
  • 19
  • 23
0

router.navigate has extra parameters like "replaceUrl". If you set it to true (when you change query params), the browser will consider you don't change page. So an history.back will works.

Have a look at https://angular.io/api/router/NavigationExtras.

this.router.navigate(['/page1'], {replaceUrl: true, queryParams:{...}});
Gilsdav
  • 1,147
  • 7
  • 10
  • I tried this solution,but if i press back button it changes the queryparams of the same url.But it doesn't go back.Example --> url --> page1,after adding filter ,new url -->page1/filterid.Now if i press back(history.back),the url just changes to page1 – Trinanjan Saha Feb 05 '18 at 06:19
  • I can see that you use Url param (page1/filterid) and not query param (page1?id=filterid). But if you put "replaceUrl" when you navigate from page1 to page1/filterId, it will replace the current history item. So page1 alone will not exist anymore. – Gilsdav Feb 05 '18 at 07:06
  • i actually update query params.i was just giving a example.(should have written as queryparam).Sorry for the confusion.so this is the actual url for page 1 -->http://localhost:4200/post-login/compliance/vulnerabilities .After adding filter the url changes to http://localhost:4200/post-login/(compliance/vulnerabilities)?filter=tags.Application.keyword%3DRebellion*severitylevel%3D4 – Trinanjan Saha Feb 05 '18 at 07:52