Ошибка при попытке выполнить операцию удаления в Angular

Когда я пытаюсь выполнить операцию удаления в операциях angular CRUD, я получаю следующую ошибку: ОШИБКА в src / app / home / home.component.ts (29,37): ошибка TS2322: тип «Заголовки» не назначается для type 'HttpHeaders | {[заголовок: строка]: строка | нить[]; } '. Тип 'Заголовки' нельзя присвоить типу '{[заголовок: строка]: строка | нить[]; } '. В типе "Заголовки" отсутствует подпись индекса. Вот код:

import { Component, OnInit } from '@angular/core';
import { HttpClient, HttpResponse, HttpHeaders } from '@angular/common/http';  
import { Observable } from 'rxjs';
import 'rxjs/add/operator/map';

@Component({
  selector: 'app-home',
  templateUrl: './home.component.html',
  styleUrls: ['./home.component.css']
})
export class HomeComponent implements OnInit {
  products: any[];
  constructor(private http: HttpClient) {}
  id: number;
  private headers = new Headers({ 'Content-Type': 'application/json'});

  //Url to fetch data: http://localhost:3000/products
  getData(){
    this.http.get("http://localhost:3000/products")
      .subscribe(response=>{
        this.products = response as any[];
      });
  }

  deleteProduct(id){
    if(confirm("Are you sure?")){
      const url = `${"http://localhost:3000/products"}/${id}`;
      return this.http.delete(url, {headers: this.headers}).toPromise()
        .then(()=>{
          this.getData();
        })
    }
  }

  ngOnInit() {
    this.getData(); 
  }
}