Многоуровневая инъекция зависимостей с помощью Angular

Question

Я пытаюсь понять под капотом Угловая структура зависимости Разрешение инъекции.

У меня есть служба с именем Автомобиль , которая имеет функцию с именем fetchCarDetails (цилиндрQuant, тип Tyretype) в зависимости от Двигатель (лошадиная сила) и Шина (марки) классов.

Класс автомобиля затем разрешается вручную в User-demo компонент и параметры для класса двигателя и шины предоставляются там.

1) Класс автомобиля

import { Injectable, ReflectiveInjector } from '@angular/core';
import { EngineService } from '../services/engine.service';
import { TyreService } from '../services/tyre.service';

@Injectable()
export class CarService {
constructor(public engine: EngineService, public tyre: TyreService) { }

fetchCarDetails(cylinderQuant, tyretype) {
this.engine.cylinders = cylinderQuant;
this.tyre.tyrebrand = tyretype;
return `car has ` + `${this.engine.cylinders} and ${this.tyre.tyrebrand} as a whole.`;
}

2) Двигатель

import { Injectable } from '@angular/core';

@Injectable()
export class EngineService {
 cylinders;
 constructor(cylindernum) {
  this.cylinders = cylindernum;
}
 }
}

3) Шина

import { Injectable } from '@angular/core';

@Injectable()
export class TyreService {
tyrebrand: any;
constructor(tyre) {
this.tyrebrand = tyre;
 }
}

4) User-Demo

import { Component, ReflectiveInjector } from '@angular/core';
import { CarService } from '../services/car.service';
import { EngineService } from '../services/engine.service';
import { TyreService } from '../services/tyre.service';

@Component({
  selector: 'app-user-demo',
  templateUrl: './user-demo.component.html',
  styleUrls: ['./user-demo.component.css']
})
export class UserDemoComponent {

  carService: CarService;
  EngineService: CarService;
  TyreService: CarService;
  carDemo: string;
  constructor() {

  const injector: any = ReflectiveInjector.resolveAndCreate([CarService, EngineService, TyreService]);
    this.carDemo = injector.get(CarService);
  }

  CarDetails(): void {

    this.carDemo = this.carService.fetchCarDetails(12, 'ceat');

    console.log('Details are : ', this.carDemo);
  }   
 }
}

Получение приведенной ниже ошибки во время выполнения. Приветствуется любая помощь / предложение здесь.

Ошибка: невозможно разрешить все параметры для 'EngineService' (?). Убедитесь, что все параметры оформлены с помощью Inject или имеют допустимые аннотации типов, а «EngineService» - с помощью Injectable. Ошибка: не удается разрешить все параметры для EngineService (?). Убедитесь, что все параметры оформлены с помощью Inject или имеют допустимые аннотации типов, а «EngineService» - с помощью Injectable.

Исключение