AngularJS:为什么$scope数据在ui路由器状态更改时不持久



我有两个视图,每个视图都有一个控制器,每个控制器代表一个UI路由器状态。

如果我在一个控制器中设置$scope变量,改变状态,然后返回,变量不再包含指定的值。

通过使用as服务来存储数据,我可以在状态更改时保持数据,所以我的代码可以工作。

我想象ui-router每次切换状态时都会破坏旧状态的对象并实例化新状态的对象。

我只是好奇为什么东西是这样设计的。有人能解释一下吗?

正如您所说,使用路由的AngularJS控制器背后的想法是,它们只与当前使用的对象相关。在这种情况下,路由被视为树中的一个节点,如果您从任何一个节点遍历到任何其他非子节点,那么假设旧数据仍然相关可能是不合逻辑的。但是,如果您确实浏览了子状态,那么保存数据将再次变得合乎逻辑。


示例

假设你有一个看起来像社交媒体网站的应用程序。您有一个包含消息列表的feed状态,一个用于添加自己的帖子的create状态,以及contacts应用程序。后一个有一个子状态,用于列出联系人(contacts.list(和查看单个联系人(contacts.view(:

feed -------- create -------- contacts
______|______
/             
/               
/                 
contacts.list     contacts.view

滚动浏览订阅源,如果你决定创建自己的消息,然后想回到订阅源,你可能想显示你停止的地方。然而,这需要将加载的帖子和评论以及页面上的位置和加载的图像存储在内存中。由于提要是动态的,并且已经查看过的帖子可能不会再次显示,因此刷新提要并重新开始可能更合乎逻辑。

相比之下,如果你转到联系人页面,并因此被重新路由到contacts.list,那么这些条目可能会按照字母顺序或添加的日期进行排序。如果你滚动浏览并决定查看联系人,那么当你回来时,顺序有望保持不变,而且你可能不会有任何新的联系人,所以最好从你离开的地方继续。这可以通过将联系人列表加载到父状态来完成,可能带有上次查看的联系人的ID,以查看你在哪里。这方面的一个例子可能是breadcrumb元素,它指示潜在路径树中的路径。

如果从一种状态移动到另一种状态,则在节点之间创建一条路径,例如,您离开create,然后输入feed,或者依次输入contactscontacts.list。如果您从contacts.view移动到contacts.list,则将保留contacts,因此该控制器将继续使用-它永远不会被销毁。


历史回顾与正常导航

不过,这里忽略了一个重要的区别,那就是通过移动应用程序中的向后箭头或通过浏览器上的后退按钮向后移动之间的区别。这与点击按钮进入主页形成对比,因为它假设主页在过去已经加载。

在许多移动应用程序中,导航被视为一种流程,尽可能避免使用大菜单。相反,重点放在创建历史记录上,因此可以通过向左滑动或始终单击同一按钮来重新访问以前访问过的页面,无论它们在树中的哪个位置。此外,对于移动应用程序,不能假设有可靠的网络连接,因此人们认为保持旧页面的原样比从服务器刷新和刷新要好。这也是像Ionic这样基于AngularJS的框架提供特定页面历史记录功能的原因。

最新更新