2017-03-28 3 views
0

Angenommen, dies ist mein app.module.ts Datei:Angular 2: Ist es möglich, eine Komponente in einen Service zu injizieren?

@NgModule({ 
    declarations: [ 
    AppComponent, 
    Comp1, 
    Comp2, 
    Comp3 
    ], 
    imports: [ 
    BrowserModule, 
    FormsModule, 
    HttpModule 
    ], 
    providers: [Service], 
    bootstrap: [AppComponent] 
}) 
export class AppModule { } 

Lassen Sie uns auch sagen, dass die Vorlage von AppComponent ist:

<comp1></comp1> 
<comp2></comp2> 

Wie man sehen kann ich eine Hauptkomponente haben, AppComponent. Es enthält zwei Unterkomponenten, Comp1 und Comp2, und ich möchte Comp1 dem Dienst der Anwendung injizieren. Wie kann ich es tun?

+0

Ich nehme an, Sie möchten Komponenten dynamisch zur Seite hinzufügen. Dann lies http://blog.rangle.io/dynamic-creating-components-with-angular-2/ es kann dir helfen. Wenn Sie den Komponentenstatus vom Dienst aus steuern möchten, sollten Sie dem Service die Observable-Eigenschaft hinzufügen. Komponente, die den Status ändert -> höre auf diese Eigenschaft. Ein anderer Service/eine andere Komponente legt den Wert für diese Eigenschaft fest. I.e. Der Dienst verhält sich wie ein Proxy. –

Antwort

1

Sie cannot tun Sie das, ich verstehe wirklich nicht, warum Sie Komponente in einen Dienst injizieren möchten. Es sollte der andere Weg sein.

Wenn Sie wirklich den Dienst in Komponente 1 konsumieren möchten, können Sie einfach den Dienst beziehen und ihn verwenden.

Innen Component1.ts

import {Service1} from './services/Service1'; 

constructor(private myService: Service1) { 
} 
0

Wie Sajeetharan sagte, nein man kann das nicht tun, und ich glaube nicht, Sie wollen tatsächlich eine Komponente in einen Dienst injizieren (Sie jedoch eine injizieren oder viele Dienste in einen anderen Dienst).

In Ihrem Beispiel <comp1> und <comp2> ohne Injektion COMP1 und COMP2 in app.component, nur weil da Komponenten verweisen auf einer Ansicht Vorlage in der app.component Ansicht Vorlage verwendet werden, bedeutet nicht, sie sein müssen in die Komponente injiziert, deren View-Vorlage auf sie verweist.

Um Komponenten in Ihrer appcomponent-Ansichtsvorlage referenzieren zu können, muss angle in der Lage sein, Ihre Ansichtsvorlagen zu kompilieren und alle referenzierten Komponenten aufzulösen. Dazu werden die registrierten Module durchlaufen und die in den Modulen definierten Deklarationen und Exportauflistungen betrachtet.

daher mit Ihrer aktuellen app.module Definition:

... 
    declarations: [ 
    AppComponent, 
    Comp1, 
    Comp2, 
    Comp3 
    ], 
... 

der AppComponent Ansicht Vorlage sollte in Ordnung sein Komp1, Komp2 zu verwenden und/oder Comp3 in Vorlage es nach Ansicht weil sie alle erklärt im gleichen sind NgModul. Für die Komponentendefinitionen ist kein Code geändert, um eine solche Verwendung zu erleichtern.

Verwandte Themen