如何在历史中将状态（页面）缓存回Angular JS，如IONIC

Question

IONIC有一个非常好的功能，通过使用ion-nav-view“缓存”状态，当用户访问历史状态时，它不会重新加载页面 - 控制器不会被调用，我们可以启用缓存全局或按页面。

在网站上工作时，我倾向于直接使用Angular JS而不是IONIC，因为IONIC主要用于移动混合APP开发。但是，我真的很喜欢IONIC处理“历史”和页面重新加载的方式。我知道我们可以利用Angular Service来保持页面数据并实现类似的功能。但我觉得代码不方便，我们必须把所有东西都用在服务上而不是控制器上。

举一个例子，我们在页面A上进行分页搜索，点击每个项目导航到页面B获取详细的项目信息，如果我们回到页面A，我们不想重新执行分页再次搜索。我觉得这是大多数网站的一个非常普遍的要求，IONIC的离子导航视图可以轻松实现这个功能而无需将数据移动到服务，我想知道是否有任何角度的JS插件或指令可以帮助实现这个功能，这是一些东西与IONIC的离子导航视图非常相似？

Answer 1

您可以使用$window.history.back()

Answer 2

历史是导航的结果。所以我认为你实际上是在询问负责导航和历史管理功能的AngularJS路由。 Angularjs有built-in router但ui-router似乎是更主流，因为它具有额外的功能。

Answer 3

我也在寻找答案，没有幸运。 一个答案是 http://www.tivix.com/blog/dont-forget-the-back-button-in-your-single-page-ap

作者提到了ngRouter的[reloadOnSearch]选项，但我怀疑这个答案。

从ui-router v0.2.5开始，也有reloadOnSearch选项，但它不是出于我们的目的。

另一个答案是 http://www.bennadel.com/blog/2801-revisiting-routing-nested-views-and-caching-with-ngroute-in-angularjs-1-x.htm

我认为现在没有简单的方法，你必须保持控制器的状态，并恢复控制器在popstate事件上的状态，并重现所有控制器的动作。 另一种方式是缓存render-html，但是如何角度触摸恢复的html呢？

Answer 4

我也需要相同的功能，我找到了这个lib： http://christopherthielen.github.io/ui-router-extras/#/sticky

我认为它可以解决问题，但它会对性能产生影响 因为每个打开的状态仍然在后台工作并使用内存和CPU。 （我认为）

修改

ui-router添加了stiky功能请看到这个链接： ui-router/sticky-states

在这里你可以如何使用它 1）添加插件

import {StickyStatesPlugin} from "ui-router-sticky-states";

angular.module('myapp', ['ui.router']).config(function($uiRouterProvider) {
  $uiRouterProvider.plugin(StickyStatesPlugin);
});

2）将状态标记为粘性

let adminModule = {
  name: 'admin',
  sticky: true,
  views: {
    admin: { component: AdminComponent }
  }
}