目前我的项目中有两个共享模块
这两个模块都由根级模块导入并且随处可用。
现在我试图将 shared.module 分成两部分:
pub.shared.modules 和 admin.shared.module 其中一些通用模块仍将用于 shared.module.ts
所以,我在 admin.module 和 pub.shared.module 中导入了 shared.module
希望我不必将模块/组件/管道从 shared.module 导入到这些。
但是尽管被导入了,我还是必须在 admin.shared.module 和 pub.shared.module 中再次导入它才能工作。
我得到的错误是我的组件 pub.layout.component 无法识别。
我的想法是将 pub.shared.module 作为延迟加载模块导入包括主页在内的公共页面。但我没有在我的根级模块中导入这个模块。
shared.module.ts
import { SharedMaterialModule } from './shared-material.module';
import { NgModule } from '@angular/core';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { RouterModule } from '@angular/router';
import { FlexLayoutModule } from '@angular/flex-layout';
import { TranslateModule } from '@ngx-translate/core';
import { PerfectScrollbarModule } from 'ngx-perfect-scrollbar';
import { SidebarTopComponent } from './components/sidebar-top/sidebar-top.component';
// ALL TIME REQUIRED
import { NotificationsComponent } from './components/notifications/notifications.component';
import { SidenavComponent } from './components/sidenav/sidenav.component';
import { BreadcrumbComponent } from './components/breadcrumb/breadcrumb.component';
import { AppComfirmComponent } from './services/app-confirm/app-confirm.component';
import { AppLoaderComponent } from './services/app-loader/app-loader.component';
// DIRECTIVES
import { FontSizeDirective } from './directives/font-size.directive';
import { ScrollToDirective } from './directives/scroll-to.directive';
import { AppDropdownDirective } from './directives/dropdown.directive';
import { DropdownAnchorDirective } from './directives/dropdown-anchor.directive';
import { DropdownLinkDirective } from './directives/dropdown-link.directive';
import { snSideNavToggleDirective } from './directives/ecom-side-nav-toggle.directive';
// PIPES
import { RelativeTimePipe } from './pipes/relative-time.pipe';
import { ExcerptPipe } from './pipes/excerpt.pipe';
import { GetValueByKeyPipe } from './pipes/get-value-by-key.pipe';
// SERVICES
import { RoutePartsService } from './services/route-parts.service';
import { AuthGuard } from './services/auth/auth.guard';
import { AppConfirmService } from './services/app-confirm/app-confirm.service';
import { AppLoaderService } from './services/app-loader/app-loader.service';
import { DialogSearchComponent } from './components/pub-header/dialog-search/dialog-search.component';
// import { APP_INITIALIZER } from '@angular/core';
import { CommonApiService } from './services/commonapi.services';
import { ScriptService } from './services/script.service';
const classesToInclude = [
DialogSearchComponent,
SidebarTopComponent,
SidenavComponent,
NotificationsComponent,
BreadcrumbComponent,
AppComfirmComponent,
AppLoaderComponent,
FontSizeDirective,
ScrollToDirective,
AppDropdownDirective,
DropdownAnchorDirective,
DropdownLinkDirective,
snSideNavToggleDirective,
RelativeTimePipe,
ExcerptPipe,
GetValueByKeyPipe
];
@NgModule({
imports: [
PerfectScrollbarModule,
SharedMaterialModule,
FormsModule,
RouterModule,
FlexLayoutModule,
TranslateModule,
ReactiveFormsModule
],
entryComponents: [AppComfirmComponent,
AppLoaderComponent,
DialogSearchComponent],
providers: [
RoutePartsService,
AuthGuard,
AppConfirmService,
AppLoaderService,
CommonApiService,
ScriptService
],
declarations: classesToInclude,
exports: [classesToInclude]
})
export class SharedModule { }
pub.shared.module.ts
import { NgModule } from '@angular/core';
import { CategoryNavigationService } from './services/category-navigation.service';
import { PubHeaderComponent} from './components/pub-header/pub-header.component'
import { PubLayoutComponent } from './components/layouts/pub-layout/pub-layout.component';
import { PubFooterComponent } from './components/pub-footer/pub-footer.component';
import { PubLayoutService } from './services/pub-layout.service';
import { CatalogService } from './services/catalog.service';
import { SeoService } from './services/seo.service';
import { SalesService } from './services/sales.service';
import { SharedMaterialModule} from './shared-material.module';
import { SharedModule } from './shared.module';
import { RouterModule } from '@angular/router';
import { BrowserModule } from '@angular/platform-browser';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { PerfectScrollbarModule, PERFECT_SCROLLBAR_CONFIG, PerfectScrollbarConfigInterface } from 'ngx-perfect-scrollbar';
import { MatSidenavModule } from '@angular/material/sidenav';
const classesToInclude = [
PubFooterComponent,
PubLayoutComponent,
PubHeaderComponent,
];
const DEFAULT_PERFECT_SCROLLBAR_CONFIG: PerfectScrollbarConfigInterface = {
suppressScrollX: true
};
@NgModule({
declarations: classesToInclude,
imports: [SharedMaterialModule, SharedModule, RouterModule, MatSidenavModule,
BrowserAnimationsModule, BrowserModule, PerfectScrollbarModule],
providers:[
CategoryNavigationService,
PubLayoutService,
CatalogService,
SeoService,
SalesService,
{ provide: PERFECT_SCROLLBAR_CONFIG, useValue: DEFAULT_PERFECT_SCROLLBAR_CONFIG },
],
exports: classesToInclude
})
export class PubSharedModule {}
<块引用>
注意我再次导入了一些模块,但我没有导入这个 到我的根级模块。
如果需要,我可以转发更多代码。
编辑:只要我将此 pub.shared.module 导入根级模块。一切正常。