Here is the interface that I am working with:
export interface IQuest {
Id: number,
lat: number,
lon: number,
Question:string,
Answer:boolean,
IsDone:boolean,
Correct:boolean,
Range:number}
Along with the following component:
export class AppComponent implements OnInit{
currentUserLatitude=49.8121157;
currentUserLongitude=19.041796;
constructor(private http:HttpClient){};
data:IQuest[]|any=[];
ClosestLocation:IQuest|any;
ngOnInit(){
this.getClosestQuest();
}
getClosestQuest(){
let url = "http://127.0.0.1:5153/api/GetClosest?
cuLon="+this.currentUserLongitude+"&cuLat="+this.currentUserLatitude;
console.log("getClosestQuest() -nowWorking");
this.http.get(url).subscribe(data=>{
console.warn(data);
console.log(data);
this.ClosestLocation=data;
});
https://i.sstatic.net/ld6ep.png
However, I encounter an error when attempting to access values of ClosestLocation using a function like this:
displayQuestion(){
console.warn("range: "+this.ClosestLocation.Range);
}
The error message in the console reads:
ERROR TypeError: Cannot read properties of undefined (reading 'Range')
at AppComponent.displayQuestion (app.component.ts:81:61)
at AppComponent.ngAfterViewInit (app.component.ts:31:10)
at callHook (core.mjs:2488:22)
at callHooks (core.mjs:2457:17)
at executeInitAndCheckHooks (core.mjs:2408:9)
at refreshView (core.mjs:10490:21)
at detectChangesInternal (core.mjs:11624:9)
at RootViewRef.detectChanges (core.mjs:12115:9)
at ApplicationRef.tick (core.mjs:25402:22)
at ApplicationRef._loadComponent (core.mjs:25440:14)
I'm looking for a way to assign a value to ClosestLocation so that I can access it later without encountering errors. I have tried changing the API call to return object type of
ClosestLocation:IQuest[]|any;
But the issue persists.