创建要在创建新组件时重用的基础组件

Question

我正在整理一个包含许多模式的应用程序。由于我不想重复模态代码，因此我想组装一个具有最小结构的基础组件，然后使用该结构来组装不同的模态并携带我所需的内容（形式，文本，图片）

我要做什么的一个例子

<app-modal-base>
  <app-form></app-form>
<app-modal-base>

希望您能理解我的需求。万一您找不到，有人找到了替代解决方案？

谢谢

Answer 1

在基本模式模板中，包含<ng-content></ng-content>标签。显示模态时，可以按以下方式使用它：

<Modal>
  <div id="mydiv">
    <p> Simple paragraph </p>
    <form>...</form>
  </div>
</Modal>

模态将包括您在基本模态组件的模板中<Modal></Modal>标记所在的<ng-content></ng-content>标记之间包含的内容。看起来像：

template: `
  <div id="closeButton"></div>
  <ng-content></ng-content>
`

此信息是从this source收集的，我似乎找不到关于此的官方文档。您可能需要尝试一下。