Search code examples
angularrouterangular-activatedroute

detect which are the origin location of user


Let's suppose we have an application with a router configured as follows:

export const routes: Routes = [
  { 
    path: 'supply', component: SupplyListComponent
  },
  {  
    path: 'supply/:id', component: SupplyComponent 
  }
];

Each supply can have one or more identifiers inside. Within the Supplycomponent, we have a paginator that shows each supply ID, one by one, on a card, changing the URL each time the user clicks on the next button. Example:

{
  "supply1": [id_1],
  "supply2": [id_2, id_3, id_4]
}

If we push Supply1, we go to '/supply/id_1'. If we push Supply2, we to '/supply/id_2', and we can change between ids with the paginator.

We want to access to this SupplyComponent in two ways: from the location '/supply' and from another aplication.

What's the problem? If we want to go to '/supply/id_3' from another application, we need to use ActivatedRoute, take that id and retrieve the information from API. But we only show the id_3 information, not all the information of Supply2.

Is there any way to 'detect' if the user comes from '/supply' or from another application? I've been looking for similar questions, but none fits my need.

Thanks in advance


Solution

  • I think by using same root you will not be able to do that alternatives could be

    using query params

    when you change the root on paginator click add some query params for eg.if you'r redirecting like router.navigate(['yourroute']) then add param like router.navigate(['yourroute'],{queryParams:{orgin:'supply1'}}) and then get query params like

    this.activatedRoute.queryParams.subscribe(data=>{
    if(data['orgin']){
    //request is from your internal app
    }
    })
    

    using multiple route

    add one more root with same component and add route data

      {  
        path: 'supply1/:id', component: SupplyComponent ,data:{origin:'supply1'}
      }
    

    and get data in component like

    this.activatedRoute.data.subscribe(data=>{
        if(data['orgin']){
        //request is from your internal app
        }
        })
    

    and nevigate to suply1/yourid from your paginator