如何在兩個子Angular2組件之間共享父HTML？

我對Angular來說很新。我的應用程序有多個「頁面（組件）」，它們共享相同的內容 - 頁眉，頁面的總體佈局等。它們可以共享css和html（而不是在每個組件中重複），但是我不知道該怎麼去做。這基本上是我想要做的：如何在兩個子Angular2組件之間共享父HTML？

<parentPage> 
    <childPage1></childPage1> 
</parentPage> 

<parentPage> 
    <otherChildPage></otherChildPage> 
</parentPage>

任何人都可以指出我在正確的方向嗎？「childPage1」和「otherChildPage」組件是完全不同的。一個有一堆鏈接，另一個是帶有一些圖像的格式化文本的牆。但這些組件之外的頁面總體佈局在兩者之間完全相同。

來源

2017-03-17 William Curry

我想我可以有一個樣式表導入到每個組件中。但是這並不能解決共享的html問題。 –

Angular是一個「Single Page Application」框架。例如你，如果你有一個登錄頁面，你的代碼可能是這個樣子：

<html> 
    <body> 
    <header-component/> 
    <login-component/> 
    </body> 
</html>

則當角用戶登錄刪除login-component並用profile-component

<html> 
    <body> 
    <header-component/> 
    <profile-component/> 
    </body> 
</html>

這種方式將其替換你只有1頁，你可以根據需要換出組件。我建議遵循一個角度（2？）教程，這將解釋如何實現這一目標。

來源

2017-03-17 03:26:42

你期望的基本上是SPA網站。如果你的應用程序要有通用的UI查詢，你需要在根index.html和根組件以及子組件後續查找主查找器 sol 2：將共同的共享html作爲父組件，然後你的孩子是2個小部件。所以總共有3個組件。 sol 3：這種方法可以通過UI-Routing輕鬆實現 - 從谷歌閱讀和理解。

來源

2017-03-17 02:15:38 Saravanan

希望這樣的結構纔有意義

<parentPage> 
    <container> 
     <childPage1></childPage1> 
     <otherChildPage></otherChildPage> 
    </container> 
</parentPage>

parentPage - 可以讓你的共同佈局

容器 - 可以讓你的孩子的組件，你可以選擇正確的子組件（這是在容器內進行組件的各自的HTML文件，你可以使用* ngIf來選擇你想渲染哪個子組件）

來源

2017-03-17 03:42:12 Nugu

如何在兩個子Angular2組件之間共享父HTML？

回答

相關問題