Struggling with implementing a system for manual entry of mutual fund information, I am running into errors when trying to read properties from the 'fund' model in my application. The Developer Tools console is displaying the following error message:
ERROR TypeError: Cannot read properties of undefined (reading 'map')
at funds.service.ts:18
at map.js:7
at OperatorSubscriber._next (OperatorSubscriber.js:9)
at OperatorSubscriber.next (Subscriber.js:31)
at map.js:7
at OperatorSubscriber._next (OperatorSubscriber.js:9)
at OperatorSubscriber.next (Subscriber.js:31)
at filter.js:6
at OperatorSubscriber._next (OperatorSubscriber.js:9)
at OperatorSubscriber.next (Subscriber.js:31)
Here is the code snippet for the 'Fund' service:
// funds.service.ts //
import { Injectable } from "@angular/core";
import { HttpClient } from "@angular/common/http";
import { Fund } from "./fund.model";
import { Subject } from "rxjs";
import { Router } from "@angular/router";
import { map } from "rxjs";
@Injectable({providedIn: 'root'})
export class FundsService {
private funds: Fund[] = [];
private fundsUpdated = new Subject<Fund[]>();
constructor(private http: HttpClient, private router: Router) {}
getFunds() {
this.http.get<{ message: string, funds: any }>('http://localhost:3000/api/funds')
.pipe(map((fundData) => {
return fundData.funds.map(fund => {
return {
fund_ticker: fund.fund_ticker,
short_low: fund.short_low,
short_high: fund.short_high,
long_low: fund.long_low,
long_high: fund.long_high,
id: fund._id
};
});
}))
.subscribe(transformedFunds => {
this.funds = transformedFunds;
this.fundsUpdated.next([...this.funds]);
});
}
I assumed that by importing the 'Fund' interface using 'import { Fund } from "./fund.model";', the system would recognize it. Is there a need to explicitly define the Fund model within the funds.service.ts file? How can I resolve this issue? Below is the structure of the model interface.
// fund.model.ts //
export interface Fund {
id: string;
fund_ticker: string;
short_low: number;
short_high: number;
long_low: number;
long_high: number;
}
Your assistance will be greatly appreciated. Feel free to ask for clarification or suggest improvements to my question if needed.