Router Navigate does not call ngOnInit when same page

by

You can inject the ActivatedRoute and subscribe to params

constructor(route:ActivatedRoute) {
  route.params.subscribe(val => {
    // put the code from `ngOnInit` here
  });
}

The router only destroys and recreates the component when it navigates to a different route. When only route params or query params are updated but the route is the same, the component won’t be destroyed and recreated.

An alternative way to force the component to be recreated is to use a custom reuse strategy. See also Angular2 router 2.0.0 not reloading components when same url loaded with different parameters? (there doesn’t seem to be much information available yet how to implement it)

More Related Contents:

  1. Difference between Constructor and ngOnInit
  2. Why is ngOnInit called twice?
  3. Angular 2 Component Constructor Vs OnInit [duplicate]
  4. Angular 2 ngOnInit not called
  5. Can I get today’s date plus one month in moment js? [duplicate]
  6. How do I pass data to Angular routed components?
  7. Using Pipes within ngModel on INPUT Elements in Angular
  8. Angular 2 http.post() is not sending the request
  9. Location and HashLocationStrategy stopped working in beta.16
  10. Ionic 2 – global NavBar for the app
  11. Angular 2 – 2 Way Binding with NgModel in NgFor
  12. Using multiple instances of the same service
  13. Angular 4: no component factory found,did you add it to @NgModule.entryComponents?
  14. Compile dynamic HTML in Angular 4/5- something similar to $compile in Angular JS
  15. What is in Angular 2 Opaque Token and What’s the Point?
  16. Cannot find a differ supporting object ‘[object Object]’ of type ‘object’. NgFor only supports binding to Iterables such as Arrays
  17. Ionic – Horizontal scroll tab for Categories [duplicate]
  18. Difference between interfaces and classes in Typescript
  19. Angular2 router.navigate refresh page
  20. Angular 2 ng2-bootstrap modal inside child component called from parent component
  21. formGroup expects a FormGroup instance
  22. Angular2 @Input to a property with get/set
  23. Angular 2: How to use JavaScript Date Object with NgModel two way binding
  24. How to truncate text in Angular2?
  25. Angular Material 2 DataTable Sorting with nested objects
  26. Angular 2 – Services consuming others services before call a method
  27. want to show more data in another component when view in detail button is clicked (angular 6)
  28. What is the difference between “ng-bootstrap” and “ngx-bootstrap”?
  29. Disable Input fields in reactive form
  30. Want to prevent Component recreation while routing in Angular 2

Leave a Comment