首页 文章

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

提问于
浏览 次
3

我想将网页保留在内存中，以便当我点击后退按钮（不是网络浏览器上的那个）或路由器链接时，如果我已经访问它，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

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

html memory typescript angular

2 回答

  • 2

    只需缓存服务中的数据，如What is the correct way to share the result of an Angular 2 Http network call in RxJs 5?中所述

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

    回复于
  • 1

    那么，对于那些有同样问题的人，我认为管理它的最好方法是将数据映射到 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 是否为真 .

    回复于

相关问题