Durandal与ASP.NET MVC的集成新方法

ASP.NET MVC项目中使用Durandal框架可以为单页面应用程序(SPA)提供强大的支持。本文将介绍一种新的方法来集成Durandal与ASP.NET MVC,这种方法比之前的方法更为直接和高效。虽然旧的方法仍然有效,但新的方法提供了一种更直接的方式来映射控制器操作到Durandal视图,而不是使用之前文章中描述的“通用”操作。

配置Durandal的ViewLocator

Durandal的ViewLocator可以通过参数来告诉Durandal在哪里查找视图文件。这是解决问题的关键。

首先,需要查看main.js文件,并找到以下代码:

define([ 'durandal/app', 'durandal/viewLocator', 'durandal/system', 'plugins/router', 'services/logger' ], boot); function boot(app, viewLocator, system, router, logger) { app.start().then(function () { viewLocator.useConvention(); }); }

这段代码告诉Durandal使用“默认约定”来查找视图,例如/app/views/*.html。为了告诉Durandal使用其他约定,需要改变这个行为:

define([ 'durandal/app', 'durandal/viewLocator', 'durandal/viewEngine', 'durandal/system', 'plugins/router', 'services/logger' ], boot); function boot(app, viewLocator, viewEngine, system, router, logger) { app.start().then(function () { viewLocator.useConvention( 'viewmodels', '../../durandal' ); viewEngine.viewExtension = '/'; }); }

viewLocator.useConvention的第一个参数告诉Durandal将/Apps/viewmodels/目录设置为视图模型js文件的位置。第二个参数则告诉Durandal使用URL http://<mydomain>/durandal/来查找视图。此外,viewExtension参数告诉Durandal视图没有扩展名(就像MVC控制器...)。

接下来,需要添加一个新的控制器来处理视图的动作和路由:

public class DurandalController : Controller { public ActionResult Shell() { return View(); } public ActionResult Home() { return View(); } public ActionResult Nav() { return View(); } public ActionResult Details() { return View(); } public ActionResult Sessions() { return View(); } public ActionResult Footer() { return View(); } }

这个控制器将为Durandal渲染动态视图。

这部分很简单,只需在“Views”下添加一个名为“Durandal”的文件夹,并将/App/Views/中的所有*.html文件复制到新创建的文件夹中。将文件重命名为.cshtml,就完成了。

完成以上步骤后,可以启动应用程序。结果将是热毛巾项目的常规外观,但背后有一个完全工作的MVC控制器。

注意事项

这两种方法,本文讨论的和之前文章讨论的,都有它们的优缺点。对于CMS行为,可能需要一个更通用的操作,但本文讨论的示例也有其用途。

沪ICP备2024098111号-1
上海秋旦网络科技中心:上海市奉贤区金大公路8218号1幢 联系电话:17898875485