Florence
Florence

Reputation: 1721

router navigate with angular 7

I have a question about navigation with angular somewhere in my code i have

this.router.navigate([12345678 + '/data']);

in my app-routing.module

    path: ':nossnbr/data',
    component: DataComponent,
  },

in my component DataComponent (in NgOnInit)

  ngOnInit() {
     this.routerSubscription = this.activatedRoute.params.subscribe(params => {
        // ....   do something
     });

  }

the navigate (this.router.navigate([12345678 + '/data']);) does not work. Nothing is happening , we do not go through the subscription

On the other hand if I type directly the url(localhost:4200/12345678/data) in the browser, there, it passes in the subscription

what is the difference between the 2 calls? Why it does not go through subscription when I use navigate ?

Upvotes: 0

Views: 4853

Answers (2)

varundhariyal
varundhariyal

Reputation: 1915

Best Practice

You need to also define module name along with route.If routing is applied in root module only then module name is not required in route but when in different module route is navigate by defining module name where we need routing followed by route.

For example : There are 2 modules: app and home module, we have defined one route in home routing module i.e /dashboard.

In root/app routing module define module routing like:

 path: 'home-module',
  loadChildren: () => import('./home/home.module').then(m => 
  m.HomeModule)
 },

In home module's component's .ts we will define routing like:

this._router.navigate(['./home-module/dashboard/']);

Upvotes: 1

Sven Jäger
Sven Jäger

Reputation: 133

What is your url at the point, when you navigate away with the router?

If its not localhost:4200 then you need to edit the navigatie-url to:

this.router.navigate([12345678, 'data'])

Upvotes: 0

Related Questions