admin管理员组

文章数量:1391977

I am trying to get a service working in Angular 5. This is what I have:

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


@Injectable()
export class DataService {

  constructor() { }

  getData() {
    // don't use 'any', type your data instead!
    return this.httpClient.get<any>('./assets/data.json');
  }

}

I'm getting the following error:

Property HttpClient does not exist on type DataService.

What am I missing?

I am trying to get a service working in Angular 5. This is what I have:

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


@Injectable()
export class DataService {

  constructor() { }

  getData() {
    // don't use 'any', type your data instead!
    return this.httpClient.get<any>('./assets/data.json');
  }

}

I'm getting the following error:

Property HttpClient does not exist on type DataService.

What am I missing?

Share Improve this question edited Dec 8, 2017 at 11:41 edkeveked 18.4k10 gold badges59 silver badges95 bronze badges asked Dec 8, 2017 at 11:10 user8770372user8770372 3
  • This is covered in the documentation – Michael Doye Commented Dec 8, 2017 at 11:12
  • 2 You've accepted the wrong answer! Don't use what @florinache said, instead, go with Rahul's or Chandru's answer! – baao Commented Dec 8, 2017 at 11:27
  • You are right...Thanks for letting me know ... now changed – user8770372 Commented Dec 8, 2017 at 11:33
Add a ment  | 

5 Answers 5

Reset to default 3

Try like this :

readmore about httpClient here

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

@Injectable()
export class DataService {

  constructor(private httpClient: HttpClient) { }

  getData() {
    // don't use 'any', type your data instead!
    return this.httpClient.get<any>('./assets/data.json');
  }

}

You need to import HttpClient from the module like below

import {HttpClient} from '@angular/mon/http';

and you code should be like this

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

@Injectable()
export class DataService {

  constructor(private httpClient: HttpClient) { }

  getData() {
    // don't use 'any', type your data instead!
    return this.httpClient.get<any>('./assets/data.json');
  }

}

Consider updating the code as follows:

import { Injectable } from '@angular/core';
import { Http } from "@angular/http";

@Injectable()
export class DataService {

  constructor(private httpClient: Http) { }

  getData() {
    // don't use 'any', type your data instead!
    return this.httpClient.get<any>('./assets/data.json');
  }

}

Let me know if it works.

Http Calls have been modified and moved to '@angular/mon/http' as HttpClient, since the idea was supported by many developers since its move to '@angular/mon/http' from Angular 4.3 and further imports of Http Module from @angular/http is deprecated from Angular 5.Check out the changes here : https://jaxenter./road-to-angular-5-133253.html.

Now to your question, you should import HttpClient Module and create an instance of it. So your code would be like:-

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

@Injectable() export class DataService {

constructor(private _httpClient: HttpClient) { }

getData() {
    // don't use 'any', type your data instead!
    return this._httpClient.get<any>('./assets/data.json');
}

}

For me the problem was that I didn't have the httpClient listed as private in my constructor.

Original Constructor:

constructor(
  httpClient: HttpClient
) { }

Updated Constructor that resolved the error:

constructor(
  private httpClient: HttpClient
) { }

本文标签: javascriptAngular Service and HttpClient Type does not existStack Overflow