Angular is able to successfully retrieve the current route when it is defined, but

Question

Angular is able to successfully retrieve the current route when it is defined, but

Here's the code snippet I am working with:

import { Router } from '@angular/router';

Following that, in my constructor:

constructor(router: Router) {
    console.log(this.router.url);
}

Upon loading the page, it initially shows the URL as "/"

Unhandled Promise rejection: Error in ./BaPageTop class BaPageTop - inline template:22:4 caused by: Cannot read property 'url' of undefined ;

I aim to verify if the current URL matches /login, and otherwise redirect to "/login" within the constructor. My attempt using window.location.href did not work, possibly because the URL isn't changing?

angular typescript ng-admin

Answer 1

Answer №1

After reviewing your constructor code, it appears that this.router is never assigned a value, which means it will always be undefined. By default, parameters passed into a constructor do not automatically become properties of this. To address this issue, consider updating your code as follows:

constructor(router: Router) {
    console.log(router.url);
}

Alternatively, if you intend to use this.router elsewhere in the class, you can declare the parameter with either the public or private keywords like so:

constructor(private router: Router) {
    console.log(this.router.url);
}

Answer 2

After reviewing your constructor code, it appears that this.router is never assigned a value, which means it will always be undefined. By default, parameters passed into a constructor do not automatically become properties of this. To address this issue, consider updating your code as follows:

constructor(router: Router) {
    console.log(router.url);
}

Alternatively, if you intend to use this.router elsewhere in the class, you can declare the parameter with either the public or private keywords like so:

constructor(private router: Router) {
    console.log(this.router.url);
}

Angular is able to successfully retrieve the current route when it is defined, but

Answer №1

Similar questions

What is the proper way to utilize queries in BlitzJS?

Exploring Angular 2 Paper-Input for Effective Form Management

Guide to iterating through different endpoints in a predetermined sequence

Unable to execute OAuth2 with Okta using angular-oauth2-oidc framework

Is it possible to save an externally retrieved image locally using Angular?

What causes interface to generate TS2345 error, while type does not?

A mistake was made: The template contains errors stating that 'app-my-profile' is an unknown element

What is the best way to remove linear-gradient effects applied by a dark mode theme?

Setting the data type of a value in a deeply nested object path using Typescript

Should I use connect or refCount with Angular and rxjs?

How can I implement a feature in Angular where clicking the edit button loads a form (in a separate component) pre-populated with previous data, along with an update button for

Setting up a variable with a changing value

Issue encountered while managing login error messages: http://localhost:3000/auth/login net::ERR_ABORTED 405 (Method Not Allowed)

TypeScript code runs smoothly on local environment, however encounters issues when deployed to production

Tips for removing the notification that the .ts file is included in the TypeScript compilation but not actively used

Structuring a TypeScript microservices repository on GitHub: Best practices to follow

Issue detected in rxjs-compat operator's shareReplay file at line 2, column 10:

Understanding the complexity of defining the type of a function can be challenging. If you're tasked with a complicated function, determining its type

Angular 7 form does not automatically disable the button upon initialization

What is the process for switching views by tapping on a button?