I am attempting to retrieve JSON data from the disk using a service:
import { Product } from './../models/Product';
import { Injectable } from '@angular/core';
import { Observable } from 'rxjs';
import { HttpClient } from '@angular/common/http';
type ProductRecord = Record<number, { product: Product; quantity: number }>;
@Injectable({
providedIn: 'root'
})
export class ProductsService {
productRecords: ProductRecord[] = [];
currentPrduct: Product = {} as Product;
constructor(private httpClient: HttpClient) {}
public getProducts(): Observable<Product[]> {
const url: string = 'src/assets/data.json';
return this.httpClient.get<Product[]>(url);
}
}
The folder structure is displayed below:
https://i.sstatic.net/4U8XR.png
An error message is shown as follows:
GET http://localhost:4200/src/assets/data.json 404 (Not Found)
Despite having the correct filepath in the source folder, why am I encountering a 404 error?
Thank you.