Angular 2 Endfassung - ngModule erkennt nicht gemeinsam genutzte Komponente

Question

Ich habe Probleme mit der Konfiguration für ngModule und meine Komponenten, letzte freigegebene Version von Angular 2. Lauf

das ist, was ich habe:

//PageHeaderModule 

import { NgModule } from '@angular/core'; 
import { CommonModule } from '@angular/common'; 
import { PageHeaderComponent } from './index'; 


@NgModule({ 
    imports: [CommonModule], 
    declarations: [PageHeaderComponent] 
}) 


export class PageHeaderModule { } 

---

//Shared Module 

import { NgModule } from '@angular/core'; 
import { CommonModule } from '@angular/common'; 
import { FormsModule } from '@angular/forms'; 

import { Routes, RouterModule } from '@angular/router'; 

import { HeaderComponent, SideBarComponent, BurgerMenuComponent, FooterComponent, InnerSpinnerComponent, PageHeaderComponent } from "./components/index"; 
import { UniqueNameValidationByList } from "./directives/index"; 
import { LowerCasePipe, WhitespacePipe } from "./pipes/index"; 

@NgModule({ 
    imports: [CommonModule, RouterModule], 
    declarations: [ 
     PageHeaderComponent, 
     HeaderComponent, 
     SideBarComponent, 
     BurgerMenuComponent, 
     FooterComponent, 
     InnerSpinnerComponent, 
     UniqueNameValidationByList, 
     LowerCasePipe, WhitespacePipe 
    ], 
    exports: [ 
     PageHeaderComponent, 
     HeaderComponent, 
     SideBarComponent, 
     BurgerMenuComponent, 
     FooterComponent, 
     InnerSpinnerComponent, 
     UniqueNameValidationByList, 
     LowerCasePipe, WhitespacePipe 
    ], 
}) 

export class SharedModule { } 

---

//AppModule 

import { NgModule }  from '@angular/core'; 
import { BrowserModule } from '@angular/platform-browser'; 
import { Routes, RouterModule } from '@angular/router'; 
import { LocationStrategy, HashLocationStrategy } from '@angular/common'; 

import { routing, appRoutes } from './app.routes'; 
import { AppComponent } from './app.component'; 


import { BillingModule } from './billing/billing.module'; 
import { CustomersModule } from './customers/customers.module'; 
import { DashboardModule } from './dashboard/dashboard.module'; 
import { DevicesModule } from './devices/devices.module'; 
import { GroupsModule } from './groups/groups.module'; 
import { ProductsModule } from './products/products.module'; 
import { ReportingModule } from './reporting/reporting.module'; 
import { LoginModule } from './login/login.module'; 

import { SharedModule } from "./shared/shared.module"; 


import { SideBarService } from "./shared/components/index"; 
import { SignalRService, CountriesService } from "./shared/services/index"; 


@NgModule({ 
    imports: [BrowserModule, 
     RouterModule.forRoot(appRoutes, { useHash: true }), 
     routing, 
     SharedModule, 
     BillingModule, 
     CustomersModule, 
     DashboardModule, 
     DevicesModule, 
     GroupsModule, 
     ProductsModule, 
     ReportingModule, 
     LoginModule 
    ], 
    declarations: [AppComponent], 
    providers: [{ provide: LocationStrategy, useClass: HashLocationStrategy }, 
     SideBarService, 
     SignalRService, 
     CountriesService], 
    bootstrap: [AppComponent], 
}) 

export class AppModule { } 

Hinweis 2 th its hier:

1) Ich benutze keine Seitenkopf-Modul, weil ich denke, dass das sharedModule sollte sich um alle diese geteilten Komponenten kümmern, stattdessen eins nach dem anderen erstellen, aber ich bin mir nicht sicher.

2) Ich verwende nur 'Ausfuhren' im gemeinsamen Modul, nicht in einer der Rest der Module innerhalb meiner app

Der Fehler, den ich immer bin, ist diese:

Ich habe viele Dinge versucht, aber nichts scheint mein Problem zu lösen, ich würde wirklich schätzen, welche Hilfe Sie bieten können.

Wenn weitere Informationen benötigt werden, lassen Sie es mich bitte wissen.

Dank

Answer 1

Ich bin nicht sicher PageHeaderComponent, welches Modul verwenden, aber Sie müssen verstehen, dass Sie SharedModule innerhalb der tatsächlichen Module mit Komponenten daraus importieren müssen, nicht in Ihrem Root-Modul, das ich vermute, ich ist was tust du.

kann ich sehen, warum das funktionieren würde, da dies die Art und Weise Module für die Anbieter arbeiten ist (wo man ein Modul mit den Anbietern in Ihrem Root-Modul importieren und können sich Anbieter den es in ganz Kind Module injizieren)

Hier ist ein Teil in eckigen Dokumenten, die ich hoffe, ist hilfreich:

Module erben nicht den Zugriff auf die Komponenten, Richtlinien oder Rohre, die in anderen Modulen deklariert sind. Was AppModule importiert, ist für ContactModule nicht relevant und umgekehrt. Bevor ContactComponent mit [(ngModel)] binden kann, muss sein ContactModule FormsModule importieren.