angularroutesstackblitz

this.router.navigate['/catalog']; not working in stackblitz project

I am beginner in Angular.

I would like to route to a page from the component.ts code (not from the template).

I started from a stackblitz and forked it, but it's not working:

https://stackblitz.com/edit/angular-router-basic-example-kbgxr6?file=app/app.component.ts

I just added this to the existing code:

  constructor(private router: Router) {}

  toCompA() {
    console.log('to comp a');
    // this is not working ?
    this.router.navigate['/catalog'];
    console.log('to comp a end');
  }

What's wrong with it?

Solution

  • You're not calling the method. This is essentially accessing property /catalog of object this.router.navigate and not doing anything with the result:

    this.router.navigate['/catalog'];

    The right syntax is:

    this.router.navigate(['/catalog']);