疯狂的ASP.NET MVC ViewEngine – Spark和Nhaml


[原文发表地址]The Weekly Source Code 30 - Spark and NHaml - Crazy ASP.NET MVC ViewEngines

[原文发表时间]2008-07-21 12:13

我最近对大家如何运用插件和其他工具扩展应用程序越来越有兴趣了。秉持着我一贯的信念—阅读代码助你成为更完美的开发者—亲爱的读者们,这里我为你们奉上第30篇“每周源代码”,之后也会不断继续。

Spark

我很喜欢ASP.NET MVC里的扩展点,不过有人比我更热衷。Spark是Louis DeJardin开发的非常有用的一款视图引擎。你可以点此下载Spark,点此加入邮件列表。Spark不仅有用,而且还很疯狂。当然是一种褒义的,促你思考的疯狂。

Louis说,我的想法就是让html来支配流,让代码天衣无缝。他说HTML应该支配流,这可不是玩笑话,看看这个:

   1: <ul>
   2:   <li each='var p in ViewData.Model.Products'>
   3:     $p.Name; $Html.ActionLink[[ProductController]](c=>c.Edit(p.Id), "Edit");
   4:   </li>
   5: </ul>

看到UL上的“each”属性了吗?很疯狂吧。

记住这不是WebForms。<li>和each属性不属于控件或者部分空间,也不是runat=server或者其他类似的东西。这是一个完全的ViewEngine,是其自身且自带的模板语言。(和大部分ViewEngine一样,尽管许多ASP.NET MVC或者MVCFramework的入门人员并不太注意到。)

这就意味着Louis对语法进行了完全的控制,你可以看到,就在HTML和其他之间的某处。在反馈的基础上,他还在进一步改写语法,所以你也有机会一起参与进来。

这是Louis’Northwind“按分类列举”的页面:

   1: <viewdata
   2:    model="IList[[Product]]"
   3:    CategoryName="string"/>
   4: ${PageTitle(CategoryName)}
   5: <CategoryMenuItems category="ViewData.Model.Select(p=>p.Category).FirstOrDefault()"/>
   6: <ul class="productlist">
   7:   <var styles='new[] {"odd", "even"}'/>
   8:   <li each="var product in ViewData.Model" class="${styles[productIndex%2]}">    <ProductImage style='"float:left;"'/>
   9:     <p>
  10:       <a href="/Products/Detail/${product.ProductID}">${product.ProductName}</a>
  11:       <br />
  12:       Price: ${String.Format("{0:C2}", product.UnitPrice)}
  13:       <span class="editlink">
  14:         (${Html.ActionLink[[ProductsController]](c=>c.Edit(product.ProductID), "Edit")})      </span>
  15:     </p>
  16:     <div style="clear:both;"></div>
  17:   </li>
  18: </ul>

注意,除了这样存在于标记标签例如<li>上的迭代器,你还可以创建变量。看到用以存放字符串odd 和 even的名为styles的数组创建,然后再看下一行,在<li>上设置class。“跳入代码块”("jump into code block")通常用${ }而不是<% %>。虽然我觉得后者看上去不错。

不过Spark的特点就在于选择,所以你可以使用${ }和<% %>中的任意一个。随你高兴。

还有就是,查看一下<CategoryMenuItems>标签。那是什么?这是一个局部视图文件,给你提供部分清晰的呈现。

如果你的局部视图文件是以下划线开头的,那你就可以从常规视图中将其名字作为tag,然后调用。你可以在右边的屏幕截图中看到两个局部视图文件。这真给include文件添加了点句法甜头。不过看着很清晰。

你可以去Louis的博客,了解更多与Spark有关的信息。

NHaml

超强的Andrew Peters创建了NHaml(MVCContrib的一部分),NHaml是一个ASP.NET的ViewEngine,使用Ruby的Haml语法。我把Andrew的作品作为一个极端的例子来告诉大家一个ViewEngine可以是什么样的。

比如,这是一个标准的“按分类列表”页面,用的是内置WebForms ViewEngine,采用 NHaml语言编写。注意,没有尖括号。而且UL标签没有结束,它只是留下了范围。空白非常重要。Haml的用户十分注重不重复,甚至标记也一样。他们希望“Markup Haiku”。

   1: #foo
   2:     - foreach (var product in ViewData)
   3:          - if (product.Category.CategoryName != null)
   4:             %h2=product.Category.CategoryName
   5:             - break    %ul.productlist
   6:         - foreach (var product in ViewData)
   7:              %li
   8:                 = Html.Image("/Content/Images/" + product.ProductID + ".jpg", product.ProductName)
   9:                  .productdetail
  10:                     =Html.ActionLink(product.ProductName, "Detail", new { ID=product.ProductID })
  11:                     %br
  12:                     Price:
  13:                      =String.Format("{0:C2}", product.UnitPrice)
  14:                         %span.editlink
  15:                             (
  16:                             =Html.ActionLink("Edit", "Edit", new { ID=product.ProductID })                            )

其他很酷的ViewEngines包括Castle的Fork of Nvelocity和Brail(在MVCContrib中)。

Comments (0)

Skip to main content