2016-08-25 5 views
3

Ich versuche meine Anwendung zu konfigurieren, um Lazy Loaded Module in RC5 zu verwenden. Dies ist das Problem, zu dem ich renne.Lazy Loading in Angular 2

Ich habe ein Modul, das RouterModule.forChild(router) verwendet und faul geladen wird, können wir es LevelOneModule nennen. Dieses Modul hat auch ein paar Module, die faul geladen werden können, nennen wir sie LevelTwoModule-s. Das funktioniert in den meisten Fällen, aber ich habe zu Bürgermeister Probleme:

  1. ich einen Dienst in meinem LevelOneModule schaffen, ich brauche in LevelTwoModule-s als Singleton zu haben, aber aus irgendeinem Grunde jede LevelTwoModule hat seine eigene Instanz von der Bedienung. Hier

ist ein Beispiel für den Code:

LevelOneModule

@NgModule({ 
    imports: [ 
     SharedModule, 
     levelOneRouter 
    ], 
    providers: [SomeService], 
    declarations: [...] 
}) 

LevelTwoModule:

@NgModule({ 
    imports: [ 
     SharedModule, 
     levelTwoRouter 
    ], 
    providers: [], 
    declarations: [...] 
}) 
  1. ich die LevelOneModule registrieren möchten einige Deklarationen, die ich in mehreren LevelTwoModule-s benötige, und ich bin mir nicht sicher, wie das geht.

Wenn ich versuche, nur die Erklärungen im LevelOneModule zu registrieren:

declarations: [SomeComponent, ANotherComponent] 

ich das nicht erkannte Element Fehler, und wenn ich versuche, separat die Deklaration in jedem LevelTwoModule zu registrieren bekomme ich die is part of the declarations of 2 modules Fehler.

Ich habe auch versucht, ein anderes SharedModule nur für das LevelOneModule zu machen, und das hat auch nicht funktioniert.

Jede Hilfe oder Info wird sehr geschätzt, nur etwas, um mir in die richtige Richtung zu zeigen.

Antwort

2

Antwort zu Frage # 1

Sie LevelOneModule stellen sollten, die Singleton zu registrieren, Sie können dies tun, indem Sie die gewünschten Anbieter in einer statischen Methode setzen:

@NgModule({ 
    imports: [ 
     SharedModule, 
     levelOneRouter 
    ], 
    providers: [], 
    declarations: [] 
}) 
export class LevelOneModule{ 
    static forRoot(): ModuleWithProviders { 
    return { 
     ngModule: LevelOneModule, 
     providers: [SomeService] 
    }; 
    } 
} 

Danach rufen in Ihre LevelTwoModule diese statische Methode beim Import:

@NgModule({ 
    imports: [ 
     LevelOneModule.forRoot(), 
     levelTwoRouter 
    ], 
    providers: [], 
    declarations: [] 
}) 

diese Weise die pr Ovider, die innerhalb von LevelOneModule instanziiert werden, werden als Singleton an das Kindmodul weitergegeben.

Für weitere Informationen: guide

Antwort auf Frage # 2

Um Erklärungen (Rohre/components/Richtlinien/Dienstleistungen) in einem anderen Modul zu machen.Sie sollten diese Erklärungen zum exports Parameter hinzu:

@NgModule({ 
    imports: [ 
     SharedModule, 
     levelOneRouter 
    ], 
    providers: [], 
    declarations: [ 
     ComponentIJustWantToUseInHere, 
     ComponentIWantToUseHereAndElsewhere 
    ], 
    exports : [ 
     ComponentIWantToUseHereAndElsewhere, 
     ComponentOrPipeOrWhateverIWantToUseElsewhere 
    ] 
}) 
export class LevelOneModule{ 
    static forRoot(): ModuleWithProviders { 
    return { 
     ngModule: LevelOneModule, 
     providers: [SomeService] 
    }; 
    } 
} 
+0

Oh Gott, du hast Recht, und es ist so einfach, nicht sicher, wie ich das verpasst. Haben Sie vielleicht auch eine Lösung für das zweite Problem? –

+0

Ich vermisste dieses Problem :) Ich edited meine Antwort – PierreDuc

+0

In Bezug auf den ersten Teil. Ich kann es nicht zur Arbeit bringen. Sie sind immer noch Singletons sollte ich das LevelOneModule.forRoot() auch in die app.module.ts importieren? Aber ich befürchte, dass das den Zweck des faulen Ladens übertrifft. –