[Fixed] In Angular: How to Check the Previous route that is sending the Id, then apply the if else condition

Issue

So what I am trying to do is. I have three components in angular2+ Application

1 Home with (/home) route

2 Products with (/product) route

3 ViewProducts with (/view product) route.

HomeComponent has Feature products.

ProductComponent has only products.

They both have a method that routes them to viewProduct Component with their feature/product _id.

Now ViewCompnenet should check that from which component the _id is coming by checking the previous
route and then do some actions according to the route.

Here is my snippet.

   for example
   in FeatureProductComponent / ProductComponet both have this method
   
      SendProductId(_ProductId){
        this._MessengerService.SendFeatureProductId(_ProductId);//I am using rxjs to send data to viewComponent
        this._Router.navigate(['viewProduct']);
      }
 

     Now at ViewProduct Component.ts
     ngOnInit(): void {
       if(_Id is coming from /home (route or slug){

        //run some block of code here

       }else if(_id is coming from /product (route or slug)){

       
                     ///run some block of code here

          }
     }

Solution

Here’s a StackBlitz with what you want:

https://stackblitz.com/edit/angular-ivy-xceqqt?embed=1&file=src/index.html

  • In the home.component.html and the list.component.html, I’ve specified query parameters on the a elements, which will be appended on navigation to the show.component.

    <a ... [routerLink]='["/product", i]' [queryParams]="{from: 'home'}"><!-- or 'list' -->
        Go to product {{ i }}
    </a>
    
  • In the show.component.ts I’m reading the value of the query parameter

    constructor(private route: ActivatedRoute) {
      this.route.queryParams.subscribe((params) => {
        this.from = <string>params.from;
      });
    }
    
  • Here you can put your if clause to decide what actions need to be taken.

Leave a Reply

(*) Required, Your email will not be published