AngularJS - 将路由组件保留在缓存中保持活动状态

编程问答 2022-05-23

问题描述

我需要将组件 A 的状态保存在缓存中，以便当我从 A 导航到 B 或 C 并返回到 A 时，它不会再次重新渲染（它还包含一个 API 调用）构造函数，所以它有点慢）。我想在用户的整个会话中保持这个初始状态。 在 Vuejs https://jsfiddle.net/shidianxia/ckj7xbqq/ 中，他们使用以下语法有一种非常简单的方法来做到这一点：

<keep-alive :include="include">
    <router-view></router-view>
</keep-alive>

我想为 AngularJS 做一些类似的事情，注意我说 JS 太老了。我有一个使用现代 angular 的混合应用程序，但保留了旧的 angularjs 路由器。

感谢您的帮助，谢谢。

解决方法

根据您的评论，我认为将它分为两​​部分构建是有意义的。

第 1 部分：在服务中保持状态 通过将状态保留在服务中，您可以限制发送到服务器的请求，从而节省时间。

第 2 部分使用 $templateCache 通过使用 angularjs 模板缓存服务，您应该将使用数据渲染视图的时间保持在最低限度。您可以在他们的文档中找到有关如何使用它的信息 https://docs.angularjs.org/api/ng/service/$templateCache

如果你最终在渲染时仍然有这个闪烁，你应该使用 ngCloak 来防止显示未编译的视图 (https://docs.angularjs.org/api/ng/directive/ngCloak)

angularangularangularjscomponentscomponents