2

我正在使用 ui-router 1.0.0-beta.3，角度 1.5。到目前为止，ui-router 很棒！

我有一个根状态，到目前为止还有一些子状态，但我注意到在兄弟姐妹（同一个根父级的孩子）之间切换会导致完全重新创建我转换/进入的状态。

我想保留范围变量，因为在我的应用程序中，用户可能会切换一些按钮，输入日期等，然后可能会切换到另一个状态，做某事，然后切换回来，但现在他们所有的部分工作都消失了。我还希望能够为“非活动”状态销毁 DOM，因为实际上某些状态可能会变得非常大，或者用户可能会创建大量 DOM，所以我希望尽可能保持 DOM对于某些州。

我知道 ui-router-extras 粘性状态功能正是这个！当我想在某些组件上销毁 DOM 时，我可以使用 $state.includes 函数来定位。但是，ui-router-extras 似乎不适用于 ui-router 1.0.0-beta.3。作者确实为较新的 ui-router 做了一个移植，但该版本是在 typescript 中的，我不知道如何将它编译成一个 js 文件。见：https ://github.com/ui-router/sticky-states/issues/4

也许我需要一个不使用粘性状态的解决方案——有什么想法吗？我正在考虑使用服务来缓存范围值，并且确实阅读了其他一些针对该影响的 SO 答案。这意味着，对于每个组件，我需要处理要缓存的范围值等。这绝对是一种可能性，但我想知道是否有人对 ui-router 有任何其他技术或知识，这样也许还有另一种方法完成我所追求的：缓存控制器/范围变化。

4

1 回答 1

3

在阅读了作者的打字稿源代码（很高兴，写得非常好）之后：

https://github.com/ui-router/sticky-states/blob/master/src/stickyStates.ts

我决定将它迁移到我自己的 javascript 服务中，这将与 ui.router 1.0.0-beta.3 兼容。顺便说一句，ui.router 1.0.0-beta.3 可在以下位置获得：

https://unpkg.com/angular-ui-router@1.0.0-beta.3/release/angular-ui-router.js

我的方法是：因为 1.0.0-beta.3 似乎没有 onCreate 转换钩子，所以我会装饰 $transitions.create 函数本身。为此，我需要在装饰中注入大量辅助函数和粘性状态的核心功能。所以我让 StickyStatesUtil 提供者为我做这件事。

迁移由两部分组成：(1) 一个名为 sticky-states-util 的模块，它创建 StickyStatesUtil 提供程序，以及一个用于检查状态/状态名称是否处于非活动状态的有用服务，以及一个 inactiveEvent，如果设置为一个值，将导致 $rootScope 广播非活动状态名称的 json 映射，以供应用程序中的任何内容使用。如果未设置，则跳过。(2)，注入 $provide 并使用它来装饰 $transitions 服务的 Angular 应用程序中的实际配置块具有新的“创建”功能。

由于其他几个人和我在同一个地方，我在 github 上提供了这段代码：

https://github.com/dsills22/sticky-states-ui-router-1-js

于 2017-03-28T22:23:01.513 回答