0

I have this routing

{
    path: ':lang',
    children: [
{
            path: 'page',
            children: [
                {
                    path: '',
                    component: PageComponent
                },
                {
                    path: ':Id',
                    component: PageComponent
                }
            ]
        },
...
}];

and my component looks like this:

export class PageComponent implements OnInit {
busy: any;
pages: Page[];
src: any;

constructor(private httpCall: HttpCall, private router: Router, private activedRoute: ActivatedRoute, public languageService: LanguageServiceService, private http: Http) {

}

ngOnInit() {
    let Id = this.activedRoute.snapshot.params['Id'];

    this.busy = this.httpCall.get('/pub/page/GetPageById/' + Id)
        .subscribe(
        data => {
            this.pages = <Page[]>data;
        })

}

}

When I first visit for example

domain.com/en/page/13

it redirects normally but If I'll try to redirect to

domain.com/en/page/14

from there it changes url but inside page everything is left as it is.

I think it's because of ngOnInit is rendering only once until I'll go in another url (outside of page)

How can I solve that?

gsiradze
  • 4,583
  • 15
  • 64
  • 111
  • Possible duplicate of [Angular2 router 2.0.0 not reloading components when same url loaded with different parameters?](http://stackoverflow.com/questions/39533291/angular2-router-2-0-0-not-reloading-components-when-same-url-loaded-with-differe) – eko May 16 '17 at 10:30
  • what is data returned by http request? – mohammad May 16 '17 at 10:52

1 Answers1

0

A snapshot will return a single value, so you have to subscribe to the 'this.activedRoute.params' observable that resolves each time the route 'domain.com/en/page/' changed.

import {Params} from "@angular/router";

export class PageComponent implements OnInit {
busy: any;
pages: Page[];
src: any;

constructor(private httpCall: HttpCall, private router: Router, private activedRoute: ActivatedRoute, public languageService: LanguageServiceService, private http: Http) {

}

ngOnInit() {
    this.activedRoute.params.subscribe( (params: Params)=>{
        let iD = params['Id'];
        this.busy = this.httpCall.get('/pub/page/GetPageById/' + Id)
        .subscribe(
        data => {
            this.pages = <Page[]>data;
        })
     });



}
El houcine bougarfaoui
  • 35,805
  • 9
  • 37
  • 37