在另一个模块中使用在 app 模块中声明的组件

Question

I have a Notification Popup declare in app module. This Notification Popup is custom so it have custom fields marked as @Inputs. I want to be able to use this component in another component that requires notification popup functionality.

@NgModule({
  declarations: [],
  imports: [
    CommonModule,
    TranslateModule.forChild(),
  ]
})
export class PopupNotificationModule { }

@NgModule({
  declarations: [
    AppComponent,
    PopupNotificationComponent 
  ],
  imports: [
    PopupNotificationModule
  ],

})

export class AppModule 

@NgModule({
  declarations: [
    CarListComponent,
  ],
  imports: [
  ],

})

export class CarModule { }

I tried importing and exporting but without succes.

Answer 1

Make a separate folder which includes notification-popup component and module file make module like

@NgModule({
  declarations: [PopupNotificationComponent],
  imports: [
    CommonModule,
    TranslateModule.forChild(),
  ]
})
export class PopupNotificationModule { }

Declare PopupNotificationComponent in PopupNotificationModule and whenever you wish to use in another module just import PopupNotificationModule and that's it.

Answer 2

first you have to add PopupNotificationComponent in declarations and export section of PopupNotificationModule like that

@NgModule({
  declarations: [PopupNotificationComponent],
  imports: [
    CommonModule,
    TranslateModule.forChild(),
  ],
  exports: [PopupNotificationComponent],
})
export class PopupNotificationModule { }

then you have to import PopupNotificationModule in app module import section like that

    @NgModule({
      declarations: [
        AppComponent
      ],
      imports: [
        PopupNotificationModule,
        CarModule 
      ],
    
    })
    
    export class AppModule

now you have import PopupNotificationModule in another module where you want to use PopupNotificationComponent

in your case it is CarModule

@NgModule({
  declarations: [
    CarListComponent,
  ],
  imports: [
    PopupNotificationModule 
  ],

})

export class CarModule { }

now you can use PopupNotificationComponent selector in CarModule components.

i hope this will work for you