Looking to retrieve an item from an array:
const device = this.selectedDevtype.devices.find(item =>
console.log(this.deviceID);
return item.device_id === this.deviceID;
});
console.log(device);
When this.deviceID
is logged, it shows "4", but the value of device
comes back as undefined.
However, if a hardcoded value like 4 is used, it works fine:
const device = this.selectedDevtype.devices.find(item =>
console.log(this.deviceID);
return item.device_id === 4;
});
console.log(device);
Why does the first function not work? What could be causing this error?
I am using TypeScript version 2.6.2 and working on Angular 5.
Essentially, the issue lies in comparing a string and a number. I realized that I had declared the type in the component class:
deviceID: number;
The Angular Material radiogroup was converting the variable to a string:
<mat-radio-group [(ngModel)]="deviceID" (change)="updateDevice()">
<mat-radio-button fxFlex="50"
*ngFor="let device of selectedDevtype.devices" value="{{ device.device_id }}">
[{{ device.key }}]{{ device.name }}
</mat-radio-button>
</mat-radio-group>
This discovery might help someone facing a similar issue.