Mvc 4单页面应用程序视图导航到站点的不同部分

时间:2013-05-10 14:37:55

标签: asp.net-mvc-4 single-page-application

我正在开始我的第一个spa mvc 4应用程序,我看过史蒂夫·桑德森的谈话,这很棒但是他的最终交付跟踪器应用程序最终有3个视图都在同一个视图页面中声明。这适用于小型应用程序,但如果您拥有具有不同数据的网站的不同部分,那么如何在更大范围内进行管理。我想要构建的网站需要保留在一个页面上,因为我想保持一个类似于Facebook风格聊天的聊天窗口,我将使用SignalR将数据推送到应用程序内固定部分的客户端。我是否只是使用@ Ajax.actions来加载我网站的完全不同的部分,就像我刚刚创建一个非spa网站一样?计划是在大多数情况下将用户保留在I站点的特定部分,但我希望在单独的视图中定义设置页面和用户配置文件管理页面。

任何好的示例代码都会非常感激我计划只使用带有knockout和nav.js的沼泽标准水疗中心,除非有人可以为mvc /实体框架建议更成熟的水疗技术,它有一些很好的文档并且很受欢迎

1 个答案:

答案 0 :(得分:2)

我所做的是糟糕的mans SPA,这基本上使我的网站像一个标准的ASP.NET MVC应用程序,所以我有多个视图,多个控制器和操作,我有一个容器div的shell页面我使用整个站点的容器来加载我的视图与Ajax调用,所以我有很多很多jQuery ajax调用,我有点试图重构我的客户端JS并进行通用导航到Javascript方法(其中在我的shell页面中,然后我从子视图调用,所以在特定的子视图中单击某个ActionLink,我会调用我的通用JS页面加载器: GoToPage(controller, action, query) 这将使用jQuery Ajax将目标控制器/动作/视图转换为shell.cshtml中的容器div。对于导航,我使用Ben Alman的hashchange plugin来检测哈希更改事件并将适当的视图加载到我的容器div中。这种方法有明显的缺点,因为你没有建立一个真正的 SPA,你正在制作一个带有SPA外观的服务器端应用程序,实际上这个和一个适当的水疗中心之间的性能差异只从服务器(而不是HTML)获取数据有点明显,但如果你是一个传统的ASP.NET MVC开发人员,这将使你不必占用Sammy.js和淘汰等新的库。最大的缺点是这就是你要编写大量重复的连接javascript,这很快就会变得混乱,特别是如果你有很多表格。虽然您可以采取某些步骤来重新分解和重用公共代码。因此总结生成视图服务器端并使用Ajax检索它们可能不是最佳的SPA解决方案,但对我来说它具有最少的学习曲线(实际上没有lol)。我最近一直在关注Durandal,我认为它最终为创建SPA提供了一个非常可行的解决方案,我特别喜欢与Sammy.js不同的是,您不必在初始页面加载时加载所有视图即使用户不打算访问这些页面。我们提供了一个很好的入门教程here