javascript - 使用應用程式元件的 HTML 的 Angular 函式庫

我正在實作我的第一個 Angular 函式庫。

我想為 Angular 實現一個頁首和頁尾的庫。問題是，它應該包含所使用應用程式的 HTML。下面您可以看到我想實現的 HTML 代碼草圖。

//some header
<pageContent>
</pageContent>
//some footer

pageContent.component 應該來自嵌入該庫的應用程式。我該如何實現這一點？

編輯：

我正在嘗試更詳細地說明：

在我的 Angular 函式庫中，我有一個元件，它應該有一個標題和一個頁腳。此外，它應該顯示頁面的主要內容。因此，這個函式庫需要輸入 pageContent.component。我該如何實現這個目標？

答案＃1

感謝您提供更多細節。請參考這個示範程式碼作為參考

如你所見，我在 canvas.component.html 中使用了 ng-content，如下所示：

<div id='border'>
   <h3>header</h3>
    <ng-content>
      <!-- Dynamic content goes here -->
    </ng-content>
    <h3>footer</h3>
</div>

畫布元件包含了你所希望的 header 和 footer。我在這個範例中加入了一些路由，以使它更接近你想要的效果。

我希望這對你有幫助。乾杯！