ASP.NET MVC学习教程之Razor语法

前言

ASP.NET MVC 3配有一个新的名为“Razor”的视图引擎选项(除了已有的.aspx视图引擎)。Razor尽量减少编写一个视图模板需要敲入的字符数，实现快速流畅的编程工作流。与大部分模板的语法不同，你不必在HTML中为了明确地标记出服务模块的开始和结束而中断编程。Razor解析器足够聪明，能从你的代码中推断出来。这使其简洁，富有表现力的语法输入干净，快速，有趣。下面话不多说了，来一起看看详细的介绍吧

1. 表达式

表达式必须跟在“@”符号之后，

2.代码块

代码块必须位于“@{}”中，并且每行代码必须以“；”结尾。代码块中定义的变量可能会被同一个域中的其他块使用。比如，定义在视图顶部的变量可以被同一视图中的代码块和代码段访问。

3. 布局

Razor通过layouts保持网页外观布局的一致性。布局模板包含基本的标签，并可以指定渲染视图内容的位置。比如

基本布局文件（_Layout.cshtml）

<!DOCTYPE Html>
<html lang=”en”>
 <head>
 <mete charset=”utf-8”/>
 <title>@View.Title</title>
 </head>
 <body>
 <div class=”header”>
  @RenderSection(“Header”);
 </div>
 @RenderBody()
 <div class=”footer”>
  @RenderSection(“Footer”);
 </div>
 </body>
</html>

布局页面定义完成后，其他视图页面就可以引用该布局文件，比如

@{Layout=”~/_Layout.cshtml”;}
@section Header {
 <h1>Page Header Content</h1>
}
@section Footer {
 Copyright @DateTime.Now.Year
}
<div class=”main”>
 Page Main Content
</div>

使用Razor布局和内容视图将页面组合在一起，展示了一个完整的页面，其中的每一块定义了页面的不同部分。

4.部分视图

使用布局通过重用部分HTML代码做到网站外观的一致性，但是有一些情况，布局则无法实现，比如，网页上的一部分信息需要多次重复出现（格式一致，显示内容不一致），例如，购物网站页面上的交易列表，只显示交易名称、当前价格和摘要信息。

ASP.NET MVC通过部分视图的技术实现了这个需求。

首先，先定义部分视图，并保存为单独的视图文件（例如，~/Views/Shared/Acution.cshtml）。

@model Auction
<div class=”auction”>
 <a href=”@Model.Url”><img src=”@Model.ImageUrl”</a>
 <h4><a href=”@Model.Url”>@Model.Title</a></h4>
 <p>Current Price :@Model.CurrentPrice</p>
</div>

然后，在需要使用该部分视图的位置，调用ASP.NET MVC自带的HTML方法调用它，比如：

@model IEnumerable<Auction>

<h2>Search Result</h2>
@foreach(var auction in Model){
 @Html.Partial(“Auction”,auction);
}

其中，Html.Partial()方法的第一个参数“Auction”是部分视图名称，并需要包含扩展名。第二个参数则是传递到部分视图的数据模型。第二个参数不是必须的，如果不传递，系统会默认将调用该部分视图的数据模型进行传递，比如，本例中的IEnumerable<Auction>。

由此可见，使用部分视图能够降低网页中的代码重复和编码复杂性，增强可读性。

5. 显示数据

MVC架构分为三层，模型、视图和控制器。三层之间彼此分离且协同工作，其中，就需要控制器担当“协调”的角色，视图将请求交给控制器，控制器对模型进行操作，并将操作结果反馈给视图，视图对模型的数据进行呈现。

控制器和视图之间的数据传递方式，ASP.NET MVC 提供了以下几种实现方式：

1)  ViewData

ViewData实现方式，它的实现类似于Dictionary的操作，使得数据传递变得非常简单。

在控制器方法中使用类似于ViewData[“DataKey”]=dataValue进行赋值，在视图文件中，使用 var dataValue=ViewData[“DataKey”]获取数据。

2) ViewBag

ViewBag的使用类型与C#中的dynamic类型，可以直接操作其属性，比如，

控制器方法：ViewBag.DataProperty=dataValue;

视图文件：var dataValue=ViewBag.DataProperty;

3) Model属性

Model属性属于强类型，并且是动态类型，可以在视图上输入”@Model”就可以直接访问。

6. HTMLHelper和URLHelper

Web请求的目标就是向用户发送HTML代码，在Razor语法中，ASP.NET MVC有两个重要的帮助类来生成对应的HTML代码，分别是HTMLHelper和URLHelper。HTMLHelper类用来生成HTML标记代码，URLHelper用来生成URL地址链接。

<img src='@Url.Content(“~/Content/images/header.jps”)'/>
@Html.ActionLink(“Home”,”Index”,”Home”)

渲染得到的HMTL代码为：

<img src='/vdir/Content/images/header.jpg'/>
<a href=”/vdir/Home/Index”>HomePage</a>

总结

以上就是这篇文章的全部内容了，希望本文的内容对大家的学习或者工作具有一定的参考学习价值，如果有疑问大家可以留言交流，谢谢大家对我们的支持。

赞 (0)

相关推荐

  • ASP.NET MVC4 Razor模板简易分页效果

    一.无数据提交 第一步,建立一个 Controller命名为PageIndex的空控制器,自定义一个方法如下: public ActionResult PageIndex(string action, string controller, int currentPage, int pageCount) { //int count = db.Product.Count(); ViewBag.PageCount = pageCount;//从操作中获取总数据页数将传入分页视图页面 ViewBag.C

  • asp.net实现在非MVC中使用Razor模板引擎的方法

    asp.net实现在非MVC中使用Razor模板引擎的方法

    本文实例讲述了asp.net实现在非MVC中使用Razor模板引擎的方法.分享给大家供大家参考.具体分析如下: 模板引擎介绍 Razor.Nvelocity.Vtemplate,Razor一般在MVC项目中使用,这里介绍在非MVC项目中的用法. 如何在非MVC中使用Razor模板引擎 借助于开源的RazorEngine,我们可以在非asp.net mvc项目中使用Razor引擎,甚至在控制台.WinForm项目中都可以使用Razor(自己开发代码生成器) 如何使用Razor 环境搭建: ① 添加

  • 使用Asp.net Mvc3 Razor视图方式扩展JQuery UI Widgets方法介绍

    JQuery UI Widgets是本人非常喜欢的一套前端JS组件,日常开发中基于原有的jquery ui widget js代码进行开发,需要写非常多的重复代码,同时一些现有组件无法满足需求的情况下,需要对现有组件进行扩展,本文使用一套基于jquery ui 的扩展js组件---jtable (http://www.jtable.org),包含了基本的列表和编辑窗口,比起jqGrid,jquery easyui grid或者extjs grid,jtable的代码非常简洁.对于grid功能要求

  • 详解ASP.NET MVC 利用Razor引擎生成静态页

    最近在研究ASP.NET MVC生成静态页,那么今天也算个学习笔记吧! 实现原理及步骤: 1.通过ViewEngines.Engines.FindView查找到对应的视图,如果是部分视图,则用:ViewEngines.Engines.FindPartialView: 2.设置上下文对象里的Model: 3.调用视图的Render()方法,将渲染结果保存到物理静态文件: using System; using System.IO; using System.Text; using System.W

  • Asp.net MVC中Razor常见的问题与解决方法总结

    Asp.net MVC中Razor常见的问题与解决方法总结

    前言 最近在学习Asp.net MVC Razor,在使用中遇到了不少的问题,所以想着总结下来,没有经验的童鞋就是这样磕磕碰碰出来的经验.话不多说,来一起看看详细的介绍: 一.Datatype的错误提示消息无法自定义 这也许是Asp.net MVC的一个Bug.ViewModel中定义了DataType为Date字段: [Required(ErrorMessage = "Birthday must be input!")] [DataType(DataType.Date, ErrorM

  • ASP.NET MVC学习教程之Razor语法

    前言 ASP.NET MVC 3配有一个新的名为"Razor"的视图引擎选项(除了已有的.aspx视图引擎).Razor尽量减少编写一个视图模板需要敲入的字符数,实现快速流畅的编程工作流.与大部分模板的语法不同,你不必在HTML中为了明确地标记出服务模块的开始和结束而中断编程.Razor解析器足够聪明,能从你的代码中推断出来.这使其简洁,富有表现力的语法输入干净,快速,有趣.下面话不多说了,来一起看看详细的介绍吧 1. 表达式 表达式必须跟在"@"符号之后, 2.代

  • Spring MVC学习教程之RequestMappingHandlerMapping匹配

    前言 对于RequestMappingHandlerMapping,使用Spring的同学基本都不会陌生,该类的作用有两个: 通过request查找对应的HandlerMethod,即当前request具体是由Controller中的哪个方法进行处理: 查找当前系统中的Interceptor,将其与HandlerMethod封装为一个HandlerExecutionChain. 本文主要讲解RequestMappingHandlerMapping是如何获取HandlerMethod和Interc

  • Spring MVC学习教程之RequestMappingHandlerAdapter详解

    前言 RequestMappingHandlerAdapter实现了HandlerAdapter接口,顾名思义,表示handler的adapter,这里的handler指的是Spring处理具体请求的某个Controller的方法,也就是说HandlerAdapter指的是将当前请求适配到某个Handler的处理器.RequestMappingHandlerAdapter是HandlerAdapter的一个具体实现,主要用于将某个请求适配给@RequestMapping类型的Handler处理.

  • PHP内核学习教程之php opcode内核实现

    opcode是计算机指令中的一部分,用于指定要执行的操作, 指令的格式和规范由处理器的指令规范指定. 除了指令本身以外通常还有指令所需要的操作数,可能有的指令不需要显式的操作数. 这些操作数可能是寄存器中的值,堆栈中的值,某块内存的值或者IO端口中的值等等. 通常opcode还有另一种称谓:字节码(byte codes). 例如Java虚拟机(JVM),.NET的通用中间语言(CIL: Common Intermeditate Language)等等. 1. Opcode简介 opcode是计算

  • jQuery插件学习教程之SlidesJs轮播+Validation验证

    SlidesJs(轮播支持触屏)--官网(http://slidesjs.com) 1.简介 SlidesJs是基于Jquery(1.7.1+)的响应幻灯片插件.支持键盘,触摸,css3转换. 2.代码 <!doctype html> <head> <style> /* Prevents slides from flashing */ #slides { display:none; } </style> <script src="http:/

  • Angular4学习教程之DOM属性绑定详解

    Angular4学习教程之DOM属性绑定详解

    前言 DOM 元素触发的一些事件通过 DOM 层级结构传播,事件首先由最内层的元素开始,然后传播到外部元素,直到它们到根元素,这种传播过程称为事件冒泡.本文主要介绍了关于Angular4 DOM属性绑定的相关内容,分享出来供大家参考学习,下面话不多说了,来一起看看详细的介绍吧. 简介 使用插值表达式将一个表达式的值显示在模版上 <img src="{{imgUrl}}" alt=""> <h1>{{productTitle}}</h1&

  • Angular4学习教程之HTML属性绑定的方法

    Angular4学习教程之HTML属性绑定的方法

    前言 本文主要给大家介绍了关于Angular4 HTML属性绑定的相关内容,分享出来供大家参考学习,下面话不多说了,来一起看看详细的介绍吧. 简介 基本HTML属性 <td [attr.colspan]="tableColspan"></td> Css 类绑定 <!-- 第一种情况 class 类全部替换 --> <div [class]="divClass">CSS 类绑定,[class] 全部替换的例子</d

  • WebGL学习教程之Three.js学习笔记(第一篇)

    webgl介绍 WebGL是一种3D绘图协议,它把JavaScript和OpenGL ES 2.0结合在一起,通过增加OpenGL ES 2.0的一个JavaScript绑定,WebGL可以为HTML5 Canvas提供硬件3D加速渲染. WebGL技术标准免去了开发网页专用渲染插件的麻烦,可被用于创建具有复杂3D结构的网站页面,甚至可以用来设计3D网页游戏. 原生的WebGl比较复杂,主要通过对顶点着色器和片元着色器的操作,来实现渲染,但实现起来比较复杂,需要一定的数学基础,但更多的是需要学习

  • ES6学习教程之Promise用法详解

    前言 promise用了这么多年了,一直也没有系统整理过.今天整理整理promise的相关东西,感兴趣的可以一起看一看.我尽量用更容易理解的语言来剖析一下promise 我准备分两篇文章来说明一下promise 一篇来理解和使用promise(本篇) 另一篇来从promise使用功能的角度来剖析下promise的源码(下一篇) 1.什么是Promise 我的理解是:实现让我们用同步的方式去写异步代码的一种技术.是异步解决方案的一种. 他可以将多个异步操作进行队列化,让它们可以按照我们的想法去顺序

  • Go语言学习教程之goroutine和通道的示例详解

    目录 goroutine 通道 Range 和 Close Select 官方留的两道练习题 等价的二叉树 网络爬虫 源码地址 goroutine goroutine是由Go运行时管理的轻量级线程. go f(x, y, z)在一个新的goroutine中开始执行f(x, y,z). goroutines运行在相同的地址空间中,所以对共享的内存访问必须同步.sync包提供了基本的同步原语(synchronization primitives),比如互斥锁(mutual exclusion loc

随机推荐