asp.net mvc3 Razor引擎中@使用规则小记

简介:

 项目中前台用的是asp.net mvc3,Razor引擎(关于Razor的介绍可以参考:http://weblogs.asp.net/scottgu/archive/2010/07/02/introducing-razor.aspx),深深体验到了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 k
15 </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代码背景颜色改一下,这样就能比较容易地识别了:

  欢迎大家留言讨论,给出更优的解决方案。



本文转自Artwl博客园博客,原文链接:http://www.cnblogs.com/artwl/,如需转载请自行联系原作者

相关文章
|
7月前
|
开发框架 前端开发 .NET
C# .NET面试系列六:ASP.NET MVC
<h2>ASP.NET MVC #### 1. MVC 中的 TempData\ViewBag\ViewData 区别? 在ASP.NET MVC中,TempData、ViewBag 和 ViewData 都是用于在控制器和视图之间传递数据的机制,但它们有一些区别。 <b>TempData:</b> 1、生命周期 ```c# TempData 的生命周期是短暂的,数据只在当前请求和下一次请求之间有效。一旦数据被读取,它就会被标记为已读,下一次请求时就会被清除。 ``` 2、用途 ```c# 主要用于在两个动作之间传递数据,例如在一个动作中设置 TempData,然后在重定向到另
352 5
|
Web App开发 XML JSON
【小家Spring】Spring MVC容器的web九大组件之---HandlerAdapter源码详解---HttpMessageConverter的匹配规则(选择原理)(上)
【小家Spring】Spring MVC容器的web九大组件之---HandlerAdapter源码详解---HttpMessageConverter的匹配规则(选择原理)(上)
【小家Spring】Spring MVC容器的web九大组件之---HandlerAdapter源码详解---HttpMessageConverter的匹配规则(选择原理)(上)
|
开发框架 前端开发 .NET
ASP.NET Core MVC 从入门到精通之Razor语法
ASP.NET Core MVC 从入门到精通之Razor语法
177 0
|
前端开发 数据库
.Net MVC订单后台管理系统源码编码过程(2)
.Net MVC订单后台管理系统源码编码过程(2)
148 0
.Net MVC订单后台管理系统源码编码过程(2)
|
SQL 开发框架 前端开发
.Net MVC订单后台管理系统源码编码过程(1)
.Net MVC订单后台管理系统源码编码过程(1)
166 0
.Net MVC订单后台管理系统源码编码过程(1)
|
前端开发 Java 程序员
💖✨MVC开发规则精讲
MVC开始是存在于桌面程序中的,M是指业务模型,V是指用户界面,C则是控制器,使用MVC的目的是将M和V的实现代码分离,从而使同一个程序可以使用不同的表现形式。比如一批统计数据可以分别用柱状图、饼图来表示。C存在的目的则是确保M和V的同步,一旦M改变,V应该同步更新。
💖✨MVC开发规则精讲
|
开发框架 .NET
ASP.NET Core 3.x Razor视图运行时刷新实时编译
ASP.NET Core 3.x Razor视图运行时刷新实时编译
128 0
|
Web App开发 前端开发 Java
【小家Spring】Spring MVC容器的web九大组件之---HandlerAdapter源码详解---HttpMessageConverter的匹配规则(选择原理)(下)
【小家Spring】Spring MVC容器的web九大组件之---HandlerAdapter源码详解---HttpMessageConverter的匹配规则(选择原理)(下)
【小家Spring】Spring MVC容器的web九大组件之---HandlerAdapter源码详解---HttpMessageConverter的匹配规则(选择原理)(下)
|
JSON 前端开发 Java
【小家Spring】Spring MVC容器的web九大组件之---HandlerAdapter源码详解---HttpMessageConverter的匹配规则(选择原理)(中)
【小家Spring】Spring MVC容器的web九大组件之---HandlerAdapter源码详解---HttpMessageConverter的匹配规则(选择原理)(中)
【小家Spring】Spring MVC容器的web九大组件之---HandlerAdapter源码详解---HttpMessageConverter的匹配规则(选择原理)(中)
|
开发框架 前端开发 NoSQL
ASP.Net Core Razor+AdminLTE 小试牛刀(下)
一个基于 bootstrap 的轻量级后台模板,这个前端界面个人感觉很清爽,对于一个大后端的我来说,可以减少较多的时间去承担前端的工作但又必须去独立去完成一个后台系统开发的任务,并且,文档还算比较齐全,对着demo可以完成一个基本的前端框架搭建了。大家如有更为好看的又方便后端上手的前端框架,也可以在留言区分享一下呗。
ASP.Net Core Razor+AdminLTE 小试牛刀(下)