AUSNAHME: Es können nicht alle Parameter aufgelöst werden

431

Ich habe eine Basis-App in Angular 2 erstellt, bin jedoch auf ein seltsames Problem gestoßen, bei dem ich keinen Dienst in eine meiner Komponenten einfügen kann. Es fügt sich jedoch gut in eine der drei anderen Komponenten ein, die ich erstellt habe.

Für den Anfang ist dies der Service:

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

@Injectable()
export class MobileService {
  screenWidth: number;
  screenHeight: number;

  constructor() {
    this.screenWidth = window.outerWidth;
    this.screenHeight = window.outerHeight;

    window.addEventListener("resize", this.onWindowResize.bind(this) )
  }

  onWindowResize(ev: Event) {
    var win = (ev.currentTarget as Window);
    this.screenWidth = win.outerWidth;
    this.screenHeight = win.outerHeight;
  }

}

Und die Komponente, mit der es nicht arbeiten will:

import { Component, } from '@angular/core';
import { NgClass } from '@angular/common';
import { ROUTER_DIRECTIVES } from '@angular/router';

import {MobileService} from '../';

@Component({
  moduleId: module.id,
  selector: 'pm-header',
  templateUrl: 'header.component.html',
  styleUrls: ['header.component.css'],
  directives: [ROUTER_DIRECTIVES, NgClass],
})
export class HeaderComponent {
  mobileNav: boolean = false;

  constructor(public ms: MobileService) {
    console.log(ms);
  }

}

Der Fehler, den ich in der Browserkonsole erhalte, ist folgender:

AUSNAHME: Es können nicht alle Parameter für HeaderComponent aufgelöst werden: (?).

Ich habe den Dienst in der Bootstrap-Funktion, also hat es einen Anbieter. Und ich scheine in der Lage zu sein, es ohne Probleme in den Konstruktor einer meiner anderen Komponenten zu injizieren.

Keith Otto
quelle
14
Vielleicht der Import? Ist '../'ein index.ts(Fass)? Können Sie versuchen, es aus der Datei zu importieren, in der es stattdessen direkt deklariert ist?
Günter Zöchbauer
Wie durch ein Wunder scheint das behoben zu sein! Seltsam, dass es mit dem Lauf nicht funktionieren würde, wenn die anderen Komponenten, mit denen ich den Service getestet habe, dies taten. Wenn du das als Antwort anstatt als Kommentar posten willst, akzeptiere ich es.
Keith Otto
11
Im Allgemeinen eine zirkuläre Abhängigkeit.
Gary
Ich hatte dieses Problem auch mit zirkulären Abhängigkeiten. Es ist erwähnenswert, dass neuere Versionen von Web Pack Ihnen dies viel besser sagen können
Enn
Sieht nach kreisförmiger Abhängigkeit aus. Wenn Sie Winkel> = 4 verwenden, können Sie intex.ts (Barrel) entfernen und alles, was Sie benötigen, direkt importieren.
Rammgarot

Antworten:

457

Importieren Sie es aus der Datei, in der es direkt anstelle des Laufs deklariert ist.

Ich weiß nicht genau, was das Problem verursacht, aber ich habe es mehrmals erwähnt gesehen (wahrscheinlich eine Art zirkuläre Abhängigkeit).

Es sollte auch durch Ändern der Reihenfolge der Exporte im Fass behoben werden können (keine Details bekannt, wurde aber auch erwähnt)

Günter Zöchbauer
quelle
16
Dies ist richtig, wenn Sie beispielsweise einen Dienst in einen anderen Dienst eingefügt haben, der zuerst im Fass erscheinen muss.
Joao Garin
17
Das Angular2-Team empfiehlt aufgrund vieler solcher Probleme keine Fässer mehr. Freut mich zu hören, dass ich helfen konnte :)
Günter Zöchbauer
13
Wusste nicht, dass das Angular 2-Team keine Fässer empfiehlt. Wenn ja, sollten sie dies im Glossar vermerken, in dem ihr Nutzen erläutert wird. Und Projekte wie angle2-webpack-Starter sollten sie nicht verwenden.
Blau
3
Es scheint, dass dies behoben wurde (kein Problem in 2.0.2). Ich finde Fässer immer noch nützlich, insbesondere wenn ich mehrere Modelle und Dienste zwischen verschiedenen Modulen importieren muss. Dies import { cleanValues, getState, FirebaseService, NotificationService, ... } from '../../shared/services';war ein Schmerz, als es nicht funktionierte (; NgModuleist keine Hilfe bei Singleton-Diensten ...
Sasxa
3
Argghh Ich habe es gelöst, indem ich die Reihenfolge der Exporte in der Fassdatei (index.ts) geändert habe. Vielen Dank
Spock
331

Zusätzlich zu den vorherigen Antworten scheint dieser Fehler auch ausgelöst zu werden, wenn Ihrem injizierbaren Service der eigentliche @Injectable()Dekorateur fehlt . Bevor Sie also die Sache mit der zyklischen Abhängigkeit und die Reihenfolge Ihrer Importe / Exporte debuggen, überprüfen Sie einfach, ob Ihr Service tatsächlich @Injectable()definiert wurde.

Dies gilt für das aktuelle Angular, Angular 2.1.0.

Ich habe eine Ausgabe zu diesem Thema eröffnet .

JP ten Berge
quelle
Ja, dieser Fehler ist normalerweise darauf zurückzuführen, dass Sie vergessen haben, @Injectable hinzuzufügen, und dass Sie beispielsweise nur das Routervon '@ angle / router' importieren. Ohne dieses Injectable tritt dieser Fehler immer auf (sobald Sie sich entscheiden, eine Zeile zu erstellen Code verwenden Sie diesen injizierten Router.
Eric Bishard
Tolle Antwort, mein Problem war, dass ich eine Methode in meinen Dienst aufgenommen und nach der letzten Klammer kein Semikolon hinzugefügt habe. Ich habe keine Ahnung, warum es so sein muss, aber es ist in Komponentenklassen nicht der Fall ... im Moment bin ich nur froh, weiterzumachen!
egimaben
Ich hatte ein einfaches Modell, das mir diesen Fehler gab. Ich habe die Verknüpfung verwendet, mit der Sie Ihre Eigenschaften im Konstruktor des Modells erstellen. Die Arten der Eigenschaften waren nur string und int. Dann trat plötzlich dieses Problem auf. Durch Hinzufügen von @Injectable () wurde das Problem behoben. Seltsam, weil keines meiner anderen Modelle Injectable hinzugefügt hat. Ich muss hinzufügen, dass ich einige Bibliotheken aktualisiert habe, bevor ich dieses neue Modell hinzugefügt habe. Möglicherweise hatte etwas damit zu tun, aber jetzt arbeiten. Vielen Dank.
Moutono
@Moutono Richtig. Mit einem leeren Konstruktor in Ihrem Dienst scheint die Abhängigkeitsinjektion nicht ausgelöst zu werden und @injectable()ist nicht erforderlich. Welches ist eine weitere Kuriosität an sich. Für ein gutes Maß würde ich es trotzdem hinzufügen, einfach für den Fall, dass Sie sich jemals entscheiden sollten, etwas zu injizieren.
JP Ten Berge
Denken Sie daran, dass, wenn Ihr Dienst eine Basisklasse hat, diese ebenfalls mit @Injectable () dekoriert werden muss
Sam Shiles
110

Ab Angular 2.2.3gibt es jetzt eineforwardRef() Dienstprogrammfunktion, mit der Sie Anbieter einfügen können, die noch nicht definiert wurden.

Mit nicht definiert meine ich, dass die Abhängigkeitsinjektionskarte den Bezeichner nicht kennt. Dies geschieht bei zirkulären Abhängigkeiten. Sie können zirkuläre Abhängigkeiten in Angular haben, die sehr schwer zu entwirren und zu sehen sind.

export class HeaderComponent {
  mobileNav: boolean = false;

  constructor(@Inject(forwardRef(() => MobileService)) public ms: MobileService) {
    console.log(ms);
  }

}

Durch Hinzufügen @Inject(forwardRef(() => MobileService))zum Parameter des Konstruktors im Quellcode der ursprünglichen Frage wird das Problem behoben.

Verweise

Angular 2 Handbuch: ForwardRef

Vorwärtsreferenzen in Winkel 2

Reactgular
quelle
3
forwardRef()war dort schon in alpha ;-) Es wird nur benötigt, wenn der MobileDienst weiter unten in derselben Datei deklariert ist. Wenn sich die Klassen in verschiedenen Dateien befinden, ist dies nicht erforderlichforwardRef()
Günter Zöchbauer
4
Günter Zöchbauer, ich versuche immer noch, das eigentliche Problem mit meinem Code herauszufinden, habe aber in der Zwischenzeit forwardRef()geholfen, die Can't resolve all parameters for ...Nachricht loszuwerden . Zumindest funktioniert die Komponente, während ich nach einer besseren Lösung für das Problem suche. (Und ja, die fehlerhafte Abhängigkeit wird direkt aus ihrer Datei importiert)
Nik
4
@ GünterZöchbauer Ich habe meine Antwort mit Referenzen aktualisiert. Ich versuche nicht, Ihre Antwort wegzunehmen, aber dies löst tatsächlich das Problem und die Leute müssen darüber Bescheid wissen. Wenn Sie die Frage googeln, gibt es keine Ergebnisse, die zu verwenden sagen forwardRef. Es ist sehr schwer zu finden. Ich habe gestern den ganzen Tag gebraucht, um dieses Problem zu lösen.
Reactgular
Seltsam. Ich habe mindestens ein Dutzend Antworten gepostet, die darauf hindeuten, foreardRefmich selbst zu benutzen, aber nicht mehr, nachdem sie NgModuleeingeführt wurden. Ich mache mir keine Sorgen, dass ich Wiederholungen verlieren könnte. Ich bin nur neugierig, warum Sie darauf stoßen, nachdem dies seit einigen Monaten nicht mehr aufgetaucht ist. Ich werde es mir genauer ansehen, wenn ich in ein paar Tagen wieder zu Hause bin. Vielen Dank für das Feedback.
Günter Zöchbauer
2
Wenn sich auch jemand wegen der Importe verlaufen hat: import {Component, Inject, ForwardRefFn, forwardRef} from '@ angle / core';
Natanael
69

FALSCH # 1: Dekorateur vergessen:

//Uncaught Error: Can't resolve all parameters for MyFooService: (?).
export class MyFooService { ... }

FALSCH # 2: Auslassen des "@" Symbols:

//Uncaught Error: Can't resolve all parameters for MyFooService: (?).
Injectable()
export class MyFooService { ... }

FALSCH # 3: Auslassen von "()" Symbolen:

//Uncaught Error: Can't resolve all parameters for TypeDecorator: (?).
@Injectable
export class MyFooService { ... }

FALSCH # 4: Kleinbuchstaben "i":

//Uncaught ReferenceError: injectable is not defined
@injectable
export class MyFooService { ... }

FALSCH # 5: Sie haben vergessen: {Injectable} aus '@ angle / core' importieren;

//Uncaught ReferenceError: Injectable is not defined
@Injectable
export class MyFooService { ... }

RICHTIG:

@Injectable()
export class MyFooService { ... }
JMI MADISON
quelle
27

Wie bereits erwähnt, wird das Problem durch die Exportbestellung innerhalb des Fasses verursacht, die durch zirkuläre Abhängigkeiten verursacht wird.

Eine ausführlichere Erklärung finden Sie hier: https://stackoverflow.com/a/37907696/893630

Michael
quelle
3
Die Bestellung hat mein Problem nicht gelöst. Das Fass nicht zu benutzen tat es.
Michael Laffargue
21

Ich bin auch darauf gestoßen, indem ich Service A in Service B eingefügt habe und umgekehrt.

Ich finde es gut, dass dies schnell fehlschlägt, da es wahrscheinlich sowieso vermieden werden sollte . Wenn Sie möchten, dass Ihre Dienste modularer und wiederverwendbarer sind, sollten Sie Zirkelverweise so weit wie möglich vermeiden. Dieser Beitrag hebt die Fallstricke hervor, die damit verbunden sind.

Daher habe ich folgende Empfehlungen:

  • Wenn Sie der Meinung sind, dass die Klassen zu oft interagieren (ich spreche von Feature-Neid ), sollten Sie die beiden Dienste zu einer Klasse zusammenführen .
  • Wenn das oben Genannte für Sie nicht funktioniert, sollten Sie einen dritten Dienst (an EventService) in Betracht ziehen, den beide Dienste einspeisen können, um Nachrichten auszutauschen.
Stephen Paul
quelle
1
Dies ist definitiv das, was mir passiert ist, und dies ist der richtige Weg. Wenn Sie wissen, dass mehr als ein Dienst aktualisiert werden muss, verwenden Sie einen EventService. Es ist erweiterbarer, da Sie diese Ereignisse zweifellos nutzen müssen, wenn Sie die Anwendung basierend auf diesen Ereignissen erweitern.
mächtige Brötchen
17

Zum Nutzen der Suchenden; Ich habe diesen Fehler bekommen. Es war einfach ein fehlendes @ -Symbol.

Dh dies erzeugt den Can't resolve all parameters for MyHttpServiceFehler.

Injectable()
export class MyHttpService{
}

Hinzufügen der fehlenden @ Symbols behebt Problem.

@Injectable()
export class MyHttpService{
}
HockeyJ
quelle
2
In meinem Fall habe ich zusätzliche Klassen und Schnittstellen zwischen @Injectable und der Serviceklassendefinition hinzugefügt, sodass die Serviceklasse nicht mehr als injizierbar markiert wurde.
Herc
Wenn Sie den Dekorator @Injectable () für eine Serviceklasse, die andere injizierbare Services verwendet, vollständig vergessen, wird dieser Fehler auch von Ihrem nicht ordnungsgemäß dekorierten Service ausgelöst.
I. Buchan
10

In meinem Fall musste ich import "core-js/es7/reflect";meiner Bewerbung etwas hinzufügen , damit es @Injectablefunktioniert.

AJ Richardson
quelle
9

Eine andere Möglichkeit besteht emitDecoratorMetadatadarin, in tsconfig.json nicht auf true gesetzt zu haben

{
  "compilerOptions": {

     ...

    "emitDecoratorMetadata": true,

     ...

    }

}
Stewart_R
quelle
8

Sie erhalten diesen Fehler, wenn Sie Service A haben , der von einer statischen Eigenschaft / Methode von Service B abhängt, und der Service B selbst von Service A durch Abhängigkeitsinjektion abhängt. Es ist also eine Art zirkuläre Abhängigkeit, obwohl dies nicht der Fall ist, da die Eigenschaft / Methode statisch ist. Wahrscheinlich ein Fehler, der in Kombination mit AOT auftritt .

MK
quelle
Ich hatte es auch, wenn es eine Abhängigkeit von einer Funktion gibt, die einfach in derselben Datei definiert ist. Durch Aufteilen in eine separate Datei wurde das Problem behoben.
Joe
1
Danke, dass Sie es erwähnt haben. Ich habe mich in der genauen Situation befunden. Mir war nicht klar, dass der direkte Zugriff auf statische Klassen etwas mit dem DI zu tun haben kann. Ich hatte dieses Schema: A -> Bund beide verwendeten dieselbe statische Klasse. Die Lösung forwardRefhilft, aber ich werde schauen, wie dies entwirrt werden könnte. Ich werde wahrscheinlich versuchen, aus dieser statischen Klasse einen echten Service zu machen (dies wird auch zu einem besseren Design führen).
Slava Fomin II
8

Neben dem fehlenden @Injectable()Dekorateur

Fehlender @Injectable()Dekorator in der abstrakten Klasse hat Folgendes erzeugt: Kann nicht alle Parameter für den Service auflösen: (?) Der Dekorator muss sowohl in MyServiceals auch in der abgeleiteten Klasse vorhanden seinBaseService

//abstract class
@Injectable()
abstract class BaseService { ... }

//MyService    
@Injectable()
export class MyService extends BaseService {
.....
}
Bart
quelle
7

In meinem Fall ist es passiert, weil ich den Typ für einen Konstruktorparameter nicht deklariert habe.

Ich hatte so etwas:

constructor(private URL, private http: Http) { }

und dann das Ändern in den Code unten löste mein Problem.

constructor(private URL : string, private http: Http) {}
Alf Moh
quelle
5

für mich fehlte es einfach ()an @Injectable. Richtig ist @Injectable ()

Repo
quelle
Oder in meinem Fall versehentlich das Löschen der @
TDP
4

Das Entfernen von Parametern aus der injizierbaren Konstruktor () -Methode löste es für meinen Fall.

Matjaz Hirsman
quelle
Das war auch genau mein Problem. Ich bin gekommen, um es zu posten, habe aber festgestellt, dass du es zuerst getan hast! +1
Aesede
Wie sende ich dann die Parameter an einen wiederverwendbaren Dienst?
3gwebtrain
4

In meinem Fall war es wegen des Plugins Augury, deaktivieren Sie es wird gut funktionieren. Alternative Option ist aot, funktioniert auch.

Alle Credits an @ Boboss74, er hat die Antwort hier gepostet: https://github.com/angular/angular/issues/23958

Tinh Dang
quelle
2

Nun, für mich war das Problem noch ärgerlicher. Ich habe einen Dienst innerhalb eines Dienstes verwendet und vergessen, ihn als Abhängigkeit im AppModule hinzuzufügen! Ich hoffe, dies hilft jemandem, mehrere Stunden beim Ausfall der App zu sparen, nur um sie wieder aufzubauen

Ophir Stern
quelle
1
Mir fehlte nur eine @InjectAnmerkung. Ich habe genau übersehen, was die Fehlermeldung ein bisschen sagt. Wenn Sie keine zirkulären Abhängigkeiten vermuten, gehen Sie einfach zu der im Fehler genannten Klasse und sehen Sie sich alle Konstruktorparameter und alle mit Anmerkungen versehenen Klassenmitglieder an @Injectund stellen Sie sicher, dass Sie DI für alle richtig ausführen. Mehr zu DI hier: angular.io/docs/ts/latest/guide/dependency-injection.html
Alexander Taylor
2

Sie müssen ein Provider-Array in @Component Decorator oder in dem Modul hinzufügen, in dem Ihre Komponente deklariert ist. Innerhalb der Komponente können Sie wie folgt vorgehen:

@Component({
  moduleId: module.id,
  selector: 'pm-header',
  templateUrl: 'header.component.html',
  styleUrls: ['header.component.css'],
  directives: [ROUTER_DIRECTIVES, NgClass],
  providers: [MobileService]
})
Shivang Gupta
quelle
2

In meinem Fall führt die Übergabe falscher Parameter an den Konstruktor zu diesem Fehler. Die Grundidee für diesen Fehler besteht darin, dass Sie unwissentlich einige falsche Argumente an eine Funktion übergeben haben.

export class ProductComponent {
    productList: Array<Product>;

    constructor(productList:Product) { 
         // productList:Product this arg was causing error of unresolved parameters.
         this.productList = [];
    }
}

Ich habe das gelöst, indem ich nur dieses Argument entfernt habe.

Codiee
quelle
2

Ich habe diesen Fehler erhalten, als ich diesen Import in der Datei polyfills.ts versehentlich deaktiviert habe. Sie müssen sicherstellen, dass er importiert wird, um diesen Fehler zu vermeiden.

/** Evergreen browsers require these. **/
// Used for reflect-metadata in JIT. If you use AOT (and only Angular decorators), you can remove.
import 'core-js/es7/reflect';
Ahmed Elkoussy
quelle
2

In meinem Fall habe ich versucht, " NativeDateAdapter" zu erweitern, um zu überschreiben "format(date: Date, displayFormat: Object) Methode Methode .

In AngularMaterial-2 DatePicker.

Im Grunde habe ich vergessen, eine @InjectableAnmerkung hinzuzufügen .

Nachdem ich dies meiner "CustomDateAdapter" -Klasse hinzugefügt habe:

@Injectable({
  providedIn: 'root'
})

Fehler ist weg.

Muhammed Ozdogan
quelle
Das hat bei mir funktioniert, aber ich habe keine Ahnung warum. Müssen sowohl der Dienst als auch die Komponente, die ihn über DI empfängt, bereitgestellt werdenIn: root, damit DI funktioniert?
Mike Furlender
2

Diese Antwort kann für dieses Problem sehr hilfreich sein. Außerdem war für meinen Fall der Export des Dienstes defaultdie Ursache.

FALSCH:

@Inject()
export default class MobileService { ... }

RICHTIG:

@Inject()
export class MobileService { ... }
otiai10
quelle
2

Das Debuggen dieses Problems kann aufgrund des fehlenden Feedbacks im Fehler sehr schwierig sein. Wenn Sie sich Sorgen über eine tatsächliche zyklische Abhängigkeit machen, sollten Sie Folgendes im Stack-Trace beachten: a) den Namen des Dienstes b) den Konstruktorparameter in diesem Dienst, der ein Fragezeichen aufweist, z. B. wenn er so aussieht:

kann nicht alle Parameter für AuthService auflösen: ([Objekt Objekt], [Objekt Objekt], [Objekt Objekt], [Objekt Objekt] ,?)

dann bedeutet dies, dass der 5. Parameter ein Dienst ist, der auch von AuthService abhängt. dh Fragezeichen bedeutet, dass es nicht von DI gelöst wurde.

Von dort müssen Sie nur noch die beiden Dienste entkoppeln, indem Sie den Code umstrukturieren.

Sarora
quelle
1

Ich bin auf diesen Fehler gestoßen, indem ich den Namen des Dienstes falsch eingegeben habe , dh den Konstruktor (privater myService: MyService ).

Bei falsch geschriebenen Diensten konnte ich anhand der Seite in Chrome-> Konsole feststellen, welcher Dienst das Problem war (ich hatte mehrere im Konstruktor aufgelistet). Sie sehen als Teil der Nachricht eine "Parameter" -Arrayliste, indem Sie Objekt Objekt, Objekt Objekt ,? Anzeigen. (oder etwas ähnliches). Beachten Sie, wo das "?" ist und das ist die Position des Dienstes, der das Problem verursacht.

Maleman
quelle
1

Obwohl die Bestellung der exportierten Klassen innerhalb von Fässern erwähnt wurde, kann das folgende Szenario den gleichen Effekt haben.

Angenommen , Sie haben Klassen A, Bund Cexportierte in derselben Datei , wo Ahängt davon ab , Bund C:

@Injectable()
export class A {
    /** dependencies injected */
    constructor(private b: B, private c: C) {}
}

@Injectable()
export class B {...}

@Injectable()
export class C {...}

Da die abhängigen Klassen (dh in diesem Fall die Klassen Bund C) Angular noch nicht bekannt sind ( wahrscheinlich zur Laufzeit während des Angular-Abhängigkeitsinjektionsprozesses von der KlasseA ), wird der Fehler ausgelöst.

Lösung

Die Lösung besteht darin, die abhängigen Klassen vor der Klasse zu deklarieren und zu exportieren, in der der DI ausgeführt wird.

dh im obigen Fall wird die Klasse Adirekt nach der Definition ihrer Abhängigkeiten deklariert:

@Injectable()
export class B {...}

@Injectable()
export class C {...}

@Injectable()
export class A {
    /** dependencies injected */
    constructor(private b: B, private c: C) {}
}
Ahmad Baktash Hayeri
quelle
1

In meinem Fall habe ich eine Klasse und eine Aufzählung aus derselben Komponentendatei exportiert:

mComponent.component.ts::

export class MyComponentClass{...}
export enum MyEnum{...}

Dann habe ich versucht, MyEnumvon einem Kind von zu verwenden MyComponentClass. Dies verursachte den Fehler "Kann nicht alle Parameter beheben" .

Durch das Verschieben MyEnumin einen separaten Ordner von MyComponentClasswurde mein Problem gelöst!

Wie Günter Zöchbauer erwähnte, geschieht dies, weil ein Dienst oder eine Komponente zirkulär abhängig ist.

Menelaos Kotsollaris
quelle
1

Wenn Ihr Dienst wird in der gleichen Datei als Bestandteil (das verbraucht es) und der Service definiert ist , definiert nach der Komponente in der Datei definiert ist, wird möglicherweise dieser Fehler angezeigt. Dies ist auf das gleiche 'forwardRef'-Problem zurückzuführen, das andere erwähnt haben. Derzeit ist VSCode nicht besonders gut darin, Ihnen diesen Fehler anzuzeigen, und der Build wird erfolgreich kompiliert.

Das Ausführen des Builds mit --aotkann dieses Problem aufgrund der Funktionsweise des Compilers maskieren (wahrscheinlich im Zusammenhang mit dem Schütteln von Bäumen).

Lösung: Stellen Sie sicher, dass der Dienst in einer anderen Datei oder vor der Komponentendefinition definiert ist. (Ich bin nicht sicher, ob forwardRef in diesem Fall verwendet werden kann, aber es scheint ungeschickt, dies zu tun).

Wenn ich einen sehr einfachen Dienst habe, der sehr stark an eine Komponente gebunden ist (ähnlich wie ein Ansichtsmodell) - z. ImageCarouselComponentIch kann es ImageCarouselComponent.service.tsso nennen, dass es nicht mit meinen anderen Diensten verwechselt wird.

Simon_Weaver
quelle
1

In meinem Fall war es ein Zirkelverweis. Ich hatte MyService, der Myservice2 anrief, und MyService2, der MyService anrief.

Nicht gut :(

Lucbonnin
quelle
1

In meinem Fall war der Grund der folgende:

  • Mein injizierbarer Service A erweiterte eine weitere Klasse B.
  • B hatte einen Konstruktor, der ein Argument erforderte
  • Ich hatte in A keinen Konstruktor definiert

Infolgedessen ist der Standardkonstruktor beim Versuch, ein Objekt A zu erstellen, fehlgeschlagen. Ich habe keine Ahnung, warum dies kein Kompilierungsfehler war.

Ich habe es behoben, indem ich einfach einen Konstruktor in A hinzugefügt habe, der den Konstruktor von B korrekt aufgerufen hat.

Vic Seedoubleyew
quelle
1

Erwischt!

Wenn Ihnen keine der oben genannten Antworten geholfen hat, importieren Sie möglicherweise ein Element aus derselben Datei, in die eine Komponente den Dienst einfügt.

Ich erkläre es besser:

Dies ist die Service - Datei :

// your-service-file.ts
import { helloWorld } from 'your-component-file.ts'

@Injectable()
export class CustomService() {
  helloWorld()
}

Dies ist die Komponente Datei :

@Component({..})
export class CustomComponent {
  constructor(service: CustomService) { }
}

export function helloWorld() {
  console.log('hello world');
}

Es verursacht also Probleme, selbst wenn sich das Symbol nicht in derselben Komponente befindet, sondern nur in derselben Datei. Verschieben Sie das Symbol (es kann eine Funktion, eine Konstante, eine Klasse usw. sein) an eine andere Stelle, und der Fehler wird ausgeblendet

Cristian Traìna
quelle
1

Versuchen Sie es mit Angular 6 und neueren Versionen

@Injectable({
  providedIn: 'root'
})

.. direkt über Ihrer Serviceklasse ohne andere Zeilen dazwischen

Vorteile

  • Der Dienst muss keinem Modul hinzugefügt werden (wird automatisch erkannt)
  • Service wird ein Singleton sein (da es in root injiziert wird)

[ eckige Dokumente ]

lolcatzftw
quelle