how to get data from url in Angular 7

Question

I used the One component For many page in angular. I want to send a parameter from each component for show any different data. So I used the this code for call each component in Html:

<a  [routerLink]="['categories']" >Page1</a>
<a  [routerLink]="['categories']" >Page2</a>

Now in routes i Used this code

  {path:'Page1' ,component : ProductCategoriesPagesComponent ,data : {PageNo : 1}},
  {path:'Page2' ,component : ProductCategoriesPagesComponent,data : {PageNo : 2}}

Then I used this code in ProductCategoriesPagesComponent

ngOnInit() {
    this.route.data
        .subscribe(data => {
          console.log("data",data);
        });
}

But i get

data {}

In console. Please Help me how I get parameters from routes If I mistake, show the best way for this method. Thanks.

Sachin Gupta · Accepted Answer · 2019-03-06 11:55:42Z

1

You need to inject ActivatedRoute and get the data from snapshot.

this.activatedRoute.snapshot.data['PageNo'];

answered Mar 6, 2019 at 11:55

Sachin Gupta

5,3493 gold badges19 silver badges33 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Jamie Rees · Accepted Answer · 2019-03-06 11:38:54Z

0

You can access the data by accessing the route's snapshot like the following:

this.route.snapshot.data['PageNo'];

So you can do the above instead of subscribing to the observable

answered Mar 6, 2019 at 11:38

Jamie Rees

8,1832 gold badges51 silver badges84 bronze badges

Collectives™ on Stack Overflow

how to get data from url in Angular 7

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related