Angular 如何在子模块而不是AppModule中添加组件？

参考答案：但这对我的问题没有帮助

我在

AppModule

下有一个子模块

PagesModule

。我在

PagesModule

中导入了一个组件，如下所示：

@NgModule({
  imports: [
    PagesRoutingModule,
    ECommerceModule,
  ],
  declarations: [
    AdvertisementComponent,
  ],
  providers: [ModuleService],
})

组成部分：

@Component({
  selector: 'ngx-advertisement',
  templateUrl: './advertisement.component.html',
  styleUrls: ['./advertisement.component.scss']
})
export class AdvertisementComponent implements OnInit {

  constructor() { }

  ngOnInit() {
  }

}

应用模块：

@NgModule({
  declarations: [AppComponent],
  imports: [
    BrowserModule,
    BrowserAnimationsModule,
    HttpClientModule,
    AppRoutingModule,
    NgbModule.forRoot(),
    ThemeModule.forRoot(),
    CoreModule.forRoot(),
  bootstrap: [AppComponent],
  providers: [
    {provide: APP_BASE_HREF, useValue: '/'},
    {provide: HTTP_INTERCEPTORS, useClass: NbAuthJWTInterceptor, multi: true},
    AuthGuard,
  ],
})
export class AppModule {
}

批准模块：

const routes: Routes = [
  { path: 'pages', loadChildren: 'app/pages/pages.module#PagesModule' },
  { path: 'auth', loadChildren: 'app/auth/auth.module#AuthModule' },
  { path: '', redirectTo: 'pages', pathMatch: 'full' },
  { path: '**', redirectTo: 'pages' },
];

const config: ExtraOptions = {
  useHash: true,
};

@NgModule({
  imports: [RouterModule.forRoot(routes, config)],
  exports: [RouterModule],
})

我正在使用

电子商务组件

模板中的

广告网组件

选择器，该模板添加到

电子商务模块

，该模块位于

页面模块

中

但我得到了以下错误：

“ngx广告”不是已知元素：

---

如果要在其模块外使用组件，还需要将其导出

@NgModule({
  imports: [
    PagesRoutingModule,
    ECommerceModule,
  ],
  declarations: [
    AdvertisementComponent,
  ],
  exports: [AdvertisementComponent],
  providers: [ModuleService],
})

---

如果要在其模块外使用组件，还需要将其导出

@NgModule({
  imports: [
    PagesRoutingModule,
    ECommerceModule,
  ],
  declarations: [
    AdvertisementComponent,
  ],
  exports: [AdvertisementComponent],
  providers: [ModuleService],
})

---

我认为更好的解决方案是共享模块

广告模块

import {NgModule} from '@angular/core';
import {AdvertisementComponent} from './advertisement.component';


@NgModule({
  imports: [],
  declarations: [
    AdvertisementComponent,
  ],
  exports: [
    AdvertisementComponent,
  ],
})

export class AdvertisementModule {
}

并将其导入其他模块中

这解决了两个问题：将组件分为两个模块和未知元素问题

---

这最适用于延迟加载。

我认为更好的解决方案是使用共享模块

广告模块

import {NgModule} from '@angular/core';
import {AdvertisementComponent} from './advertisement.component';


@NgModule({
  imports: [],
  declarations: [
    AdvertisementComponent,
  ],
  exports: [
    AdvertisementComponent,
  ],
})

export class AdvertisementModule {
}

并将其导入其他模块中

这解决了两个问题：将组件分为两个模块和未知元素问题

---

这最适用于延迟加载。

我仍然会遇到相同的错误。你认为它使用的是外部模块吗？我在

ECommerceModule

下有

ecommercommercecomponent

，而

ECommerceModule

在

PagesModule

下。您是否将PagesModule导入到了ECommerceModule中？相反。电子商务模块在PagesModule中导入。如果在模块（M1）中，您希望使用在另一个模块（M2）中声明的组件（C），则需要将M2导入M1。M2必须声明并导出C.core.js:1673错误错误：未捕获（承诺中）：错误：由模块“ECommerceModule”导入的意外值“undefined”错误：由模块“ECommerceModule”导入的意外值“undefined”我仍然收到相同的错误。你认为它使用的是外部模块吗？我在

ECommerceModule

下有

ecommercommercecomponent

，而

ECommerceModule

在

PagesModule

下。您是否将PagesModule导入到了ECommerceModule中？相反。电子商务模块在PagesModule中导入。如果在模块（M1）中，您希望使用在另一个模块（M2）中声明的组件（C），则需要将M2导入M1。M2必须声明并导出C.core.js:1673错误错误：未捕获（承诺中）：错误：由模块“ECommerceModule”导入的意外值“undefined”错误：由模块“ECommerceModule”导入的意外值“undefined”我认为您应该显示应用程序的模块结构，并指示在哪个模块中声明组件，以及您尝试在哪个模块中使用它。“这将帮助我们帮助您。”康诺斯凡我为模块添加了结构。谢谢，我认为您应该显示应用程序的模块结构，并指出在哪个模块中声明组件，以及您尝试在哪个模块中使用组件。“这将帮助我们帮助您。”康诺斯凡我为模块添加了结构。谢谢