ASP.NET MVC 3: Razor中的@:和语法

原来没注意到。。。。。。。

 

在编码过程中也遇到了一些问题，就是Razor的@标记，这个标记到底什么时候该加什么时候不该加呢？

 

　　先看一段代码（只是为了说明问题用，没任何意义）吧：

 

代码一：

 

 1 <div> 2     for(int i=0;i<3;i++) 3     { 4         </div>i<div> 5         for(int j=0;j<3;j++) 6         { 7             if(j==1) 8             { 9                 <div>10                     for(int k=0;k<5;k++)11                     {12                         k++;13                         <span>14                             k15                         </span>16                     }17                 </div>18                 break;19             }20         }21     }22 </div>　　这一段代码没添加任何@标记，肯定是有问题的，你能准确地判断出这段代码中哪些地方要添加@标记吗？看到这里，停几分钟，填上你的答案吧：），然后把你的答案跟下面的参考答案做个对比吧，如果你很确定地完成了并且完全正确，那么恭喜你，这个知识点你已经掌握了，下面的内容你可以直接跳过了。

 

　　参考答案：

 

参考答案

 1 <div> 2     @for(int i=0;i<3;i++) 3     { 4         @:</div>@i<div> 5         for(int j=0;j<3;j++) 6         { 7             if(j==1) 8             { 9                 <div>10                     @for(int k=0;k<5;k++)11                     {12                         k++;13                         <span>14                             @k15                         </span>16                     }17                 </div>18                 break;19             }20         }21     }22 </div>　　亲，做错的童鞋有木有，有木有。做错了也没什么关系啦，我之前也错了呢，这里给出一个小小的规则（自己定义的，不一定准确，如果已经有专用名词欢迎大家指出），掌握这个小规则后你就很容易做对了。

 

　　Razor语法中有block(块)的说法，这个大家应该都不陌生了，就是代码段，如我们可以把using(){}包起来的代码叫一个block(段/块)，block内部还可以有block，这个是可以嵌套的。比如上面的示例代码中我们可以把最外层的for循环内部的代码（第2行到第21行）是一个block，第4行是一个代码块，第二个for循环内部的代码（第5行到第20行）也可以叫一个block，划分不是固定的，粒度你可以自己定义。

 

　　block内部的代码分为两种，一种是HTML代码块，一种是C#（本例中为C#，也可以是其他.NET语言）代码块。有了block的概念后，Razor中@标记的规则就是：

 

如果同一种代码块（HTML代码块不需要加@，这里排除开）内部跟的是同类代码块，这时不需要加@标记，否则要加@标记

 

　　用这个规则逐一解析一下上面的代码，在解析之前我的block划分是这样的：

 

　　第1—22行，2—21行，第4行，5—20行，7—19行，9—17行，10—16行，12行，13—15行，14行

 

　　我们从里往外看，第14行外层block是HTML代码，所以第14行要加@，12行外层block也是C#代码块，因此不加，以此类推，直到第5行，这一行有点特殊，这个涉及到VS中的标签匹配。

 

　　我们知道VS能在编码时对HTML标签进行匹配，这个匹配只是给出警告，并不是强制的，用了Razor后，混在C#（也可以是其他语言）中的HTML标签也要进行匹配，只是这个匹配是在代码块内部进行的，同时也是野蛮的，如果不匹配就会出错，例如下面的代码是通不过的：

 

1 <div>

2     <tr>

3     @if(true)

4     {

5         </tr>

6     }

7 </div>　　

错误页面：

 

 

　　改为这样就好了：

 

1 <div>

2     <tr>

3     @if(true)

4     {

5         <tr></tr>

6     }

7 </div>　　

那么如果遇到像最开始那段代码</div><div>这样进行拼接的HTML怎么办呢，Razor提供了两种方案，一是在前面加上“@：”，如@:</div><div>；一是用@Html.Raw，如：@Html.Raw("</div><div>");

 

　　了解了这点后代码一第4行就应该这样：@:</div>@i<div>，第4行没问题了，最后只剩第5行了，这时直接把第4行忽略，按规则写就OK了，因为第2行是C#代码块，因此第5行不需要添加@。

 

　　好了，写到这里只剩最后一个点了，如果把代码一中第4行改为<div>i</div>，那么第5行应该是什么样的呢？如果Razor内HTML标签是匹配的，Razor可以识别，这时可以忽略匹配的HTML标签对即可。

 

　　规则有时并不是万能的，极个别的还是要经过尝试，最后说个小小的技巧，可以把Razor代码背景颜色改一下，这样就能比较容易地识别了：

 

这是我正在写的博文系列中的另一篇,涵盖ASP.NET MVC 3的一些新功能：

·        Razor中的新@模型关键字(10月19日)

·        Razor中的层(10月22日)

·        用Razor实现服务器端注释(11月12日)

·        Razor的@:和<syntax>语法（今天）

本文将讨论新版Razor里视图引擎中支持的两个有用的语法功能：@:和<text>语法。

用Razor实现流畅编程

ASP.NET MVC 3配有一个新的名为“Razor”的视图引擎选项(除了已有的.aspx视图引擎)。您可以在我发表的 介绍Razor的博客上了解更多关于Razor的信息，比如我们为什么要引进它以及 它所支持的语法。

Razor尽量减少编写一个视图模板需要敲入的字符数，实现快速流畅的编程工作流。与大部分模板的语法不同，你不必在HTML中为了明确地标记出服务模块的开始和结束而中断编程。Razor解析器足够聪明，能从你的代码中推断出来。这使其简洁，富有表现力的语法输入干净，快速，有趣。

例如下面的代码片段迭代一列商品(product)：

当运行时它产生的结果如下:

Razor用来隐式鉴别一个代码段什么时候结束的一个方法是寻找代表内容块开始的标记或元素内容。例如，在上面的代码段中Razor自动地把foreach循环里面的<li></li>模块当作一个HTML内容块，因为它看到开始的<li>标记序列并且知道这在C#中是无效的。

这个独特的技术——使用标记来识别代码中的内容块——是使Razor在涉及HTML生成的情况下简洁高效的一个重要因素。

用@明确表示内容的起始

然而不是所有的内容块都是以标记元开始，在有些案例中，Razor解析器不能隐式检测出内容块。

这就需要Razor通过在代码块中使用“@：字符序列”来显式指明内容块的开始。@：序列表明该行后面的内容应该被视为内容块：

举个更实际的例子。下面的代码段显示在商品脱销的时候，我们如何在商品名旁边输出信息“(已售完!)”：

由于我没有将消息“已售完！”嵌套在HTML标签元素内，Razor不能隐式判断@if块中的内容是否是一个内容块的开始。我们用“@：字符序列”来明确地指出我们代码段里的这行应被当作是内容块。

在@：内容块中使用代码碎块(Code Nugget)

除了输出静态内容，你也可以使代码碎块嵌入以@：字符序列开始的内容块中。

例如，在下面的代码段中我们有两个@：字符序列：

注意我们在第二个@:序列中如何发送内容块中的单品(Unit)数目的（例如“只剩下3了！”）。我们通过在内容行中嵌入一个@p.UnitsInStock代码碎块来实现。

多行内容

Razor使在HTML元素中包装多行内容变得简单。例如，下面我们的@if容器中的内容块被包装在一个HTML<p>元素中，这会使得Razor把它当作内容：

对于在那些没有被外部HTML元素包装的多行内容情形，你可以使用多个@: 序列：

另外 ，Razor允许你用一个<text>元素 来显式标识内容：

<text>标签是一个 Razor 特殊处理的元素。Razor将<text>块的内部内容视为内容块，不呈现包含那些内容的<text>标签（这意味着只呈现<text>内部内容，不呈现标签本身）。这使呈现没有被HTML元素包装的多行内容块变得方便。

如果你想要更简洁的@: 序列，<text>元素也能根据需要用来标识单行内容：

上面的代码将呈现出和我们早期看过的@:版本相同的输出。Razor会自动地从输出结果中省略掉<text>包装部件，只是呈现出<text>里面的内容。

总结

Razor启用一种简洁的模式化语法，实现非常流畅的编码工作流。 Razor能灵活地通过检测<tag>元素来识别内容块的起始， 从而让Razor方法在有HTML生成的场景中很有效，也使你不用明显地标注95% 的 if/else 和foreach 场景中内容块的开始/结束.

在当你不想在一个代码容器块中使用HTML元素，却需要更精确地标明一个内容块的边界时，你可以使用Razor的@:和<text>句法。