Angular 2/4 - 從DOM中刪除組件，但保留在內存中

Question

我正在嘗試創建同一組件的多個實例，並使它們“可以選擇”排序 - 基本上每個組件實例中只有一個應該一次可見。 問題是我知道[hidden]指令，但它對我不起作用，因為我在HTML中使用了很多ID標簽構建了這個巨大的組件，並且除了其中一個組件之外的所有組件都打破了CSS當它們同時存在於DOM中時（CSS規則，你知道嗎？）。

我的問題是，是否有一種方法可以從DOM中刪除組件，但仍然將它們保留在內存中（用於數據保留）以便以后重新插入？ 謝謝！

更新：

我能夠使用抽象的RouteReuseStrategy類來提出解決方案。 信息來自這里：

https://www.softwarearchitekt.at/post/2016/12/02/sticky-routes-in-angular-2-3-with-routereusestrategy.aspx

Answer 1

如果您使用實際重用組件實例的重用策略，您可以執行類似<router-outlet>操作。 動態創建組件時

資源

 this.activated = this.location.createComponent(factory, this.location.length, inj, []);

資源

this.location.detach();

然后將返回的r傳遞給attach(ref, ...)

資源

this.location.insert(ref.hostView);

Answer 2

保留組件間數據的最佳選擇是使用服務。 我在這里有一個簡單的例子： http ： //blogs.msmvps.com/deborahk/build-a-simple-angular-service-to-share-data/

我還有一個使用“標簽”對話框的例子。 你可以在這里找到： https ： //github.com/DeborahK/Angular-Routing in APM-Final文件夾。