Question

我对Angular 2.0+还是陌生的，因此我面临着有关模板设计的问题。我确信有一种Angular的方法可以做到这一点；我只是没有找到明确的答案。

Component basic atructure

所以，这个想法是（请参见附图）我有红色组件，该组件必须包含在应用程序的许多部分中。红色部分的样式，输入和输出对于整个应用程序将是相同的。但是在红色组件内部必须嵌入三个组件，具体取决于红色组件放置的位置。

例如，假设红色组件是详细信息页面的容器。如果将其放置在实体A的详细信息页面中，则绿色组件将是地图，黄色组件将是图像，蓝色组件将是更多按钮。所有这些组件都必须具有输入，输出以及可能的引用，以便可以使用view childs对其进行操作。

如果红色组件放置在其他位置，则这三个组件将不同。甚至可能只有2个，而不是三个组成部分。

有人对如何设计红色组件具有某种线索，以便它可以重复使用并适合我的需要吗？非常感谢，如果需要更多说明来理解我的问题，请告诉我。

Answer 1

在这种情况下，您可以使用名为ng-content的名称，在其中您可以将多个组件用作其容器数据，并传递input / events / style或您想要传递的任何内容，例如-

<red-component>
<yellow-component></yellow-component>
<blue-component></blue-component>
<green-component></green-component>
</red-component>