How can i use different selector with same name?

Question

For example, I have two module

(1) module 'A' - have a component 'list', selector 'list'

(2) module 'B' - also, have component 'list', selector 'list'

I wish to use both this 'list' component in my module's 'list' component is it possible?

If yes, then how can I use selector of those component?

Answer 1

If you want to use the list component from another list component and from different modules, you can do so by specifying entryComponents inside your Component or NgModule:

@Component({
  ...,
  entryComponents: [ AListComponent ]
})
export class BListComponent {}


or 


@NgModule({
  ...,
  entryComponents: [ AListComponent ]
})
export class ModuleB {}

BListComponent Template

   // You can then easily use & specify the AListComponent selector here
   <a-list-component></a-list-component>

---

But if those modules are merged and imported on a root module like

@NgModule({
  imports: [ AModule, BModule ]
})
export class RootModule {}

then on your ModuleA, you can just specify the component you need to export to be able to utilize it on other components

 @NgModule({
  ...,
  exports: [ AListComponent ]    // Export AListComponent to be utilized on BListComponent
})
export class ModuleA {}

BListComponent Template

<a-list-component></a-list-component>