Type '{ httpHeaders: typeof HttpHeaders; }' has no properties in common with type '{ headers?: HttpHeaders |

Question

Hi I am trying like CRUD operation but it giving the error in 'option' how can I resolve. I have written below code after that it is giving below error. I used HttpClient and HttpHeaders but then also not working.

Type '{ httpHeaders: typeof HttpHeaders; }' has no properties in common with type '{ headers?: HttpHeaders | { [header: string]: string | string[]; }; observe?: "body"; params?: HttpParams | { [param: string]: string | string[]; }; reportProgress?: boolean; responseType?: "json"; withCredentials?: boolean; }'.

I have written below code for perform CRUD operation using API.

        import { Injectable } from '@angular/core';
            import { HttpClient } from '@angular/common/http';
            import { HttpHeaders } from '@angular/common/http';

            import { Observable } from 'rxjs';
            import { Employee } from './employee';


            @Injectable({
              providedIn: 'root'
            })
            export class EmployeeService {
              url = 'http://localhost:65389/api/EmaployeeMasters';
              constructor(private http: HttpClient) { }
              getAllEmployee(): Observable<Employee[]> {
                return this.http.get<Employee[]>(this.url);
              }

              getEmployeeById(employeeid: string): Observable<Employee> {
                return this.http.get<Employee>(this.url + '/' + employeeid);
              }
              createEmployee(employee: Employee): Observable<Employee> {
                const httpHeaders = new HttpHeaders().set('Content-Type', 'application/json');
                const options = {
                  httpHeaders: HttpHeaders
                };
                return this.http.post<Employee>(this.url, employee, options);
              }

              updateEmployee(employee: Employee): Observable<number> {
                const httpHeaders = new HttpHeaders().set('Content-Type', 'application/json');
                const options = {
                  httpHeaders: HttpHeaders
                };
                return this.http.post<number>(this.url + '/' + employee.ID, employee, options);
              }
              DeleteEmployeeById(employeeid: string): Observable<number> {
                const httpHeaders = new HttpHeaders()
                  .set('Content-Type', 'application/json');
                return this.http.delete<number>(this`enter code here`.url + '/' + employeeid);
              }
            }

Johan Rin Johan Rin · Accepted Answer · 2018-12-20T15:03:43

I think there is some mistakes with your HttpHeaders. Try with something like this:

createEmployee(employee: Employee): Observable<Employee> {
  const httpOptions = { headers: new HttpHeaders({ 'Content-Type': 'application/json' }) };
  return this.http.post<Employee>(this.url, employee, httpOptions);
}

updateEmployee(employee: Employee): Observable<number> {
  const httpOptions = { headers: new HttpHeaders({ 'Content-Type': 'application/json' }) };
  return this.http.post<number>(this.url + '/' + employee.ID, employee, httpOptions);
}

Also there is some typo on your DeleteEmployeeById function. Maybe it's something like :

deleteEmployeeById(employeeid: string): Observable<number> {
   const httpOptions = { headers: new HttpHeaders({ 'Content-Type': 'application/json' }) };
   return this.http.delete<number>(this.url + '/' + employee.ID, httpOptions);
}

Type '{ httpHeaders: typeof HttpHeaders; }' has no properties in common with type '{ headers?: HttpHeaders |

2 Answers