angular2重用組件實例的視圖

Question

這是一個奇怪的上下文和問題，我知道。 我只想了解我該如何思考，這種方法出了什麼問題，爲什麼。

最後這是一個角度問題的問題。

我們開始吧。

這裏是上下文：

我所含的成分多克（後者持有的ngFor迴路建立卡的列表）組件卡。 主要關注卡組件。它有一些邏輯並顯示一個視圖。

這裏是碼頭工人的父，表示搬運工將如何使用的HTML模板：

<div [hidden]="condition"> 
    <home></home> 
</div> 
<div [hidden="!condition"]> 
    <docker></docker 
</div> 

它顯示docker或home替代地。

現在home（HomeComponent）想要也顯示相同的列表Cards。

通常我會在HomeComponent中添加一個ngFor循環來創建所有卡片。再次。 我將卡實例化兩次（一次爲docker父母，一次爲home父母）。所以每張卡片都有兩個正在運行的實例。

比方說，CardComponent有一個複雜的邏輯：收聽一些事件並通過發送其他事件作出反應。

而現在的怪異問題：

我不想創建的CardComponent的兩個實例（我不想在雙重處理的事件）。我只需要一個DockerComponent實例。在HomeComponent中也可以重用它的View（HostView）？所以組件代碼只能運行一次，但它的視圖要在生成的html中放置兩次。 並檢查更改（角度機制）以導致更新這兩個視圖。

這就像：我從DockerComponent（創建它們）傳遞CardComponent對象的數組到HomeComponent（通過服務），在這裏我從每個CardComponent對象中提取視圖並將其注入到HomeComponent中的ng容器中。

阿洛斯，具有組件對象：

• 如何訪問它的視圖？ （不可能？）

• 如何訪問ComponentRef？ （這僅在組件是動態創建時纔可用，這不是我的情況）

現在，這種情況是錯誤的，我感覺它。

但是我想要一個關於究竟是什麼錯誤的爭論，我應該如何思考這種情況。

此外，什麼是角度的限制，明確指出，以及他們背後的理由。 像你沒有訪問組件視圖，也沒有它的ComponentRef（這真的很奇怪：當我的組件對象本身我無法訪問...組件引用 - 這裏Ref是誤導，顯然不是一個正常的「參考」一詞）。

謝謝

Answer 1

我覺得你可以做點別的。讓我解釋一下。 您可以創建routeroutlet並根據路徑顯示房屋或碼頭，而不是在同一頁面中顯示和隱藏房屋和碼頭組件。裏面都可以有一個ngFor的卡組件（或者如果你不想重複ngFor代碼，創建一個「listCardsComponent」）。這種方式角路由器將自動處理卡組件的實例。