AngularJS路由架构、页面交互

问题描述 投票:0回答:1

我有一个网络应用程序,其中包含一个迷你 SPA,这是一个非常复杂的工作表。该工作表可以包含数十页,每页都有数十个字段以及指向工作表其他部分的链接。目前使用 AngularJS 构建,工作表导航或屏幕链接中的每次点击都会调用一个函数(例如 loadWorksheetPage(x))。控制器中的这些函数调用 REST 服务并加载正确的页面信息。

我现在的缺点是所有事情都发生在一个 URL 上。用户可能会在同一工作表的不同页面上花费大量时间。也许他们会期望后退按钮起作用,但目前,这会将他们带到工作表之前访问的最后一页。

此类应用程序有哪些最佳实践?这是一个迷你 SPA,所以我不希望 angularjs 处理所有路由。我可能让它在我想的工作表中处理路由(worksheet/5/page/7?)。但这可能是一个相当大的变化,我必须首先选择 MVC 路线 (worksheet/5),然后选择角度路线 (/page/7)。不确定这是否可能。我想到每当用户单击按钮加载工作表中的不同页面时,我都可以调用保存页面历史记录的 API。然后我可以中断后退按钮点击以转到正确的页面。

angularjs
1个回答
2
投票

我不确定我是否应该将此作为评论或答案发布,但就这样吧。从它的声音来看,AngularJS

ui-router
就是你所追求的。

您基本上是说您有一些复杂的形式和逻辑,您希望将其模块化为单独的路线,甚至更好的控制器和自己的视图。这正是 ui-router 所做的。

我用 ui-router 开发了一些非常复杂的表单,它为您提供无限嵌套的路由、抽象状态(当您希望您的子状态从基本状态继承一些常见功能时)、多个命名视图(具有自己的控制器的多个视图)在一个状态中)和带有可选 url 的嵌套路由,也就是说,您可以将一个状态作为另一个状态的子状态,但选择不显示子状态的 url 路径,即使它处于活动状态。

基本上 ui-router 可能是 AngularJS 最强大的扩展。它真正释放了 AngularJS 的力量,并帮助您编写更加动态和模块化的应用程序。

从这里开始:

从这里开始

介绍文章

深入指南

希望有帮助:)

© www.soinside.com 2019 - 2024. All rights reserved.