Updating the Service

Open dish.service.ts and update its contents as shown below:

import { Injectable } from '@angular/core';
import { Dish } from '../shared/dish';
import { DISHES } from '../shared/dishes';

@Injectable()
export class DishService {

constructor() { }

getDishes(): Dish[] {
return DISHES;
}
}

Notice

  • the imports of the Dish class and the DISHES constant from the shared folder. So once we've imported these two, our service can be configured to provide the value for us.
  • the new method called getDishes. This method will return the DISHES array which has been defined in the dishes.ts. With this, our Dish service is now configured to supply that DISHES JavaScript object array to any other part of our application that requires it.