angular - Typen kan inte tilldelas till typen providedIn Egenskapen ProvidedIn saknas

Jag försöker skapa en tjänst med hjälp av Angulars handledning https://angular.io/guide/http

Jag använder Angular 7.0.7.

Tjänsten skulle hämta JSON-data från någon URL:

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

@Injectable
export class ProductListService {
  constructor(private http: HttpClient) {
  }

  productListUrl: string = "https://blahblah.com/products";

  getProductList() {
    return this.http.get(this.productListUrl);
  }
}

Jag får en vågig linje under @Injectable() med titeln på denna fråga. Varför händer det, och hur löser jag det?

Jag har en komponent som kommer att använda den här tjänsten:

 import { ProductListService } from '../services/productList.service';
 @Component({
   selector: 'app-productlist',
   templateUrl: './productlist.component.html',
   styleUrls: ['./productlist.component.css'],
   providers: [ProductListService]
 })

Svar #1

Du har glömt att lägga till parenthesis för @Injectable() dekoratorn

@Injectable()
export class ProductListService {
   constructor(private http: HttpClient) {
}

Svar #2

Ditt @Injectable är inte korrekt. Lägg till providedIn-egenskapen som refererar till din komponent som kommer att använda tjänsten:

@Injectable({
  providedIn: 'app-productlist',
})
export class ProductListService {
   constructor(private http: HttpClient) {
}

En annan lösning är att bara använda dekoratorn på det sättet: @Injectable(), och att deklarera din tjänst i din app.module.ts-fil, som provider

@Injectable()
export class ProductListService {
   constructor(private http: HttpClient) {
}

Relaterade artiklar