Angular RC.5 More than one component

[kukjevov]

I'm submitting a ... (check one with "x")

[x] bug report
[x] feature request
[ ] support request => Please do not submit support request here, instead see https://github.com/angular/angular/blob/master/CONTRIBUTING.md#question

Current behavior
In angular rc.5 you can`t have multiple components with same selector, which was in previous versions working without any problem. In rc.5 you have single "context" in which are all directives stored for whole module. Previously if i added some component to @component directives array it was processed only in template of that component. Now it adds this component to some shared directives array for whole module.

By the way, this could be considered breaking change but it is not mentioned anywhere in changelog.

Expected/desired behavior

I would expected similar behaviour as for providers.
Components added to ngModule.declaration will be available in templates of all components. Components added to component.directives will override ngModule.declaration and will be available only in template of this component.

I know that probably solution would be use modules, but create module which will contain only 1 component is bad usage of ngModule. Since i have 6 components and 2 html files which are shared by 3 of them i would have to create 6 modules which is crazy.

Reproduction of the problem
Here is plunker showing problem https://plnkr.co/edit/u3ergwERz0vfsVmH0Fcb?p=preview Exactly same code would in rc.4 work without any problem. In rc.5 it is not working.

What is the motivation / use case for changing the behavior?

I need this because i have one html file for multiple components, which share same public interface but different "components" are injected into directives array. So single html can display different components.

This way i have to have 3 almost same html files (except one element).

Please tell us about your environment:

• Angular version: 2.0.0-rc.5
• Browser: [all]
• Language: [TypeScript 1.8.10]

[kylecordes]

I suspect this is by design, and that the notion is that your modules would be of modest to moderate size such that you would not have a need to have more than one component with the same selector in a single module. Yet in a large application, sprawling across many modules, accidental reuse of the same selector in those modules far afield won't cause any trouble.

[kukjevov]

That is not completely true, because this does not help your maintainability of your application, because you cant share single html between multiple components, where you need to have slightly different logic for same html.

Now you have to have there if else or switch in your code to reach same result.

[wjzhou]

I think a proxy component may be helpful here. Assigning the select to the proxy and choose the subcomponents inside the proxy.

The switch is still needed, but that is only inside the proxy component.

[awilhelmer]

I've got the same Problem. I used the selectors to have multiple components in the main app.component. The reason I did it like that was having a global template HTML. In RC.4 it was done easily in the app.component.html (Many Tags for selectors to have a central design template...)

It's a show-stopper for me, I don't know how to maintain a global HTML template. I have to repeat design things in each component.

[ItsCoding]

Same here, used a html file to include my header in all componet files...

[vaseker]

+1. Using Grid component for display different datasets on the single page.

[damiandennis]

#10552

[pkozlowski-opensource]

Yeh, this is the same discussion as in #10552, let's centralize it in there.

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}