如何使用本地存储中的两个angular2组件保存和加载页面？

Question

我一直在尝试使用下一个代码从本地存储中保存并加载包含两个angular2组件的页面，但从不应用组件中的css。

这是我保存的代码：

localStorage.setItem('body', JSON.stringify(document.getElementById("body").innerHTML));

这是我要加载的代码：

document.getElementById("body").innerHTML=JSON.parse(localStorage.getItem("body"));

我希望能很好地解释我的问题

Answer 1

抱歉，你做不到。 Angular喜欢接管很多DOM，所以你不能只是替换DOM的整个主体。但是，如果不是做整个＆＃34; body＆＃34;，而是做了一个子集，那么你可以这样做：

<div [innerHTML]="htmlVar">
</div>

htmlVar是一个变量，你加载了类似的东西：

this.htmlVar = JSON.parse(localStorage.getItem("htmlVar"))

注意，默认情况下innerHTML会删除大量＆＃34;不安全的＆＃34; HTML。您可以通过调用DomSanitizer重新启用它们中的大多数。请注意，您不能在html中使用任何Angular功能，例如与routerLink的链接。