Question

我想将网页保留在内存中，以便当我点击后退按钮（不是网络浏览器上的那个）或路由器链接时，如果我已经访问它，HTML页面会立即加载（因为我有一些数据到加载，我不想重新加载。）

我见过带标签界面的方法： https://www.w3.org/Style/Examples/007/target.en.html#tab1 但它不适合我的代码架构。

我在angular2中使用routerlink来导航投掷的页面，在点击时使用后退按钮调用函数以转到上一页。

我尽量详细说明，以便人们更好地理解我的代码架构和routerlink方法的工作方式。

后退按钮功能（独立于routerlink）：

 goBack() {
 window.history.back();
 }

第1页到第2页的路由器链接方法：

page1.html：

<a[routerLink]="['PAGE2']"> go to page 2</a>

page1.ts组件：

 import { Router, ROUTER_DIRECTIVES } from '@angular/router-deprecated';
 @Component({
 selector: 'page1',
 templateUrl: 'page1.html',
 styleUrls:  ['page1.css'],
 directives: [ROUTER_DIRECTIVES]
 })

main.ts：

import { RouteConfig, ROUTER_DIRECTIVES, ROUTER_PROVIDERS } from '@angular/router-deprecated';

@Component({
providers: [ROUTER_PROVIDERS]
})

@RouteConfig([
{ path: '/page2',  name: 'PAGE2',  component: Page2}]) //component representing class Page2 in page2.ts

欢迎任何帮助我管理它的想法，谢谢你提前！

Answer 1

只需按照What is the correct way to share the result of an Angular 2 Http network call in RxJs 5?

中的说明缓存服务中的数据

当您离开并返回组件时，目前无法阻止路由器重新创建组件。

Answer 2

那么，对于那些遇到同样问题的人，我认为管理它的最佳方法是将数据映射到这样的localStorage key：

  localStorage.setItem('favoris',JSON.stringify(my_array)); //set my data array
  array =  JSON.parse(localStorage.getItem('key_name')); //get in array

然后路由器调用的类中的ngOnInit将调用初始函数，具体取决于localStorage key是否为真。

使用Angular2将HTML页面存储在内存中

2 个答案: