Imagine going to a component at the URL localhost:4200/myComponent/id. The ID, no matter what it is, will show up as a string in the component view.
The following code snippet retrieves the ID parameter from the previous component ([routerLink]="['/myComponent', id]"), and fetches the value for internal use like this:
myComponent.ts
getURLId(): void {
this.route.params
.map(
params => params['id'])
.subscribe(
((id) => this.assignID(id)),
err => {
this.successData = false;
this.errorMessage = err
});
}
This "id" value is checked against NULL and UNDEFINED to handle errors internally. If you deliberately access localhost:4200/mycomponent/ without specifying an ID, my code should recognize that route.params has an undefined "id" value and halt:
assignID(id: string): void {
// THIS COMPARISON DOES NOT ACCOUNT FOR THE MENTIONED SCENARIO
if(id === null || id === undefined) {
// DECLARE ERROR AND SET FLAG
} else {
// PERFORM ACTIONS WITH "id" HERE...
}
}
The issue lies in how localhost:4200/mycomponent/ doesn't trigger true for the comparison (id === null or undefined).
A console.log of the "id" value displays undefined as expected.
What could be causing this discrepancy?