Error while Reading disk JSON data: 404 error [duplicate]

Question

I try to read 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 provided:

I receive an error provided below:

GET http://localhost:4200/src/assets/data.json 404 (Not Found)

As obviously the data is in the source folder and the location is correct, what is the reason that I receive a 404 error?

Thanks.

Answer 1

Remove src from the URL.

when the project becomes compiles, the assets folder comes in the root file.