Razor语法和Razor引擎大全
一、Razor语法
1、Razor的标识符
解释:@字符被定义为Razor服务器代码块的标识符,后面的表示是服务器代码了。web form中使用<%%>中写服务器代码一个道理。在vs工具里面提供了代码着色和智能感应的功能。
@{
string userName = "启超";
<span>我的名字叫:@userName</span>
<span>我的出生日期:@DateTime.Now.ToString("yyyy-MM-dd");</span>
}
2、Razor的作用域
解释:在上面一个例子中都已经使用到了大括号{},不错,大括号里面的就是表示作用域的范围,用形如 “@{code}”来写一段代码块。在作用域 “@(code)” 中输出也是用@符号的。
Index.cshtml页面:
我的年龄:
@{
int age = 25;
string sex = "男";
@age
}性别:@(sex)
3、Razor和Html混合编写
解释:
a.在作用域内容如果是以html标签开始则视为文本输出
b.如果输出@,则使用@@
c.如果要输出非html标签和非Razor语句的代码,则用 "@:" ,他的作用是相当于在处于html下面编写一样了,如果在 "@:" 后面加上@就表示Razor语句的变量,如下:
Index.cshtml页面:
@{
var strzm = "abc";
@:this is a mail:@qq.com.this is var:@strzm,this is mail@strzm,this is @@
//输出abc
@strzm
}
4、Razor类型转换
解释:As系列扩展方法和Is系列扩展方法(string类型才能转)
AsInt(),IsInt()
AsBool(),IsBool()
AsFloat(),IsFloat()
AsDecimal(),IsDecimal()
AsDateTime(),IsDateTime()
ToString()
Index.cshtml页面:
@{
string ss = "";
}
string转int:@ss.AsInt()
5、Razor其他
解释:
@Href("~/")//表示网站的根目录
@Html.Raw('<font color='red'>红字</font>')就会显示出红色的”红字“,不用的话会直接显示这段html字符串(<font color='red'>红字</font>)
————————————————————————————————————————————
二、Razor引擎
1、布局(Layout)(@RenderBody()方法)
解释:Layout方式布局就相当于一个模板一样的,我们在它地址地方去添加代码。相当于定义好框架,作为一个母版页的,在它下面的页面需要修改不同代码的地方使用@RenderBody()方法。
母版页:(~/Views/Layout/_SiteLayout.cshtml)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8"/>
<title>我的网站 - @Page.Title</title>
</head>
<body>
@RenderBody()
</body>
</html>
子页面:(~/Views/Home/About.cshtml)
@{
Layout = "~/Views/Layout/_SiteLayout.cshtml";
}
<h1>
关于我的网站
</h1>
<p>
这是一些内容显示在关于我们这个页面,我们用的是SiteLayout.cshtml这个主页母版页。
<br />
当前时间:@DateTime.Now
</p>
2、页面(@RenderPage()方法)
解释:page当需要在一个页面中,输出另外一个Razor文件(页面)的内容时候用到,比如头部或尾部这些公共的内容时需要用到,用@RenderPage()方法
母版页:(~/Views/Layout/_SiteLayout.cshtml)
<!DOCTYPE html> <html>
<head>
<meta name="viewport" content="width=device-width" />
<title>Simple Site</title>
</head>
<body>
<!--头部-->
@RenderPage("~/Views/Layout/_header.cshtml") <!--底部-->
@RenderPage("~/Views/Layout/_footer.cshtml")
</body>
</html>
公共页:(~/Views/Layout/_header.cshtml)
<div id="header">
<a href="#">主页</a>
<a href="#">关于我们</a>
</div>
3、Section区域(@RenderSection())
解释:Section是定义在Layout的页面中使用的。在Layout的页面中用。在要Layout的父页面中使用@RenderSection()方法。
母版页:(~/Views/Layout/_SiteLayout.cshtml)
<!DOCTYPE html> <html>
<head>
<meta name="viewport" content="width=device-width" />
<title>Simple Site</title>
</head>
<body>
<div id="left-menu">
@RenderSection("menu",true)
</div>
</body>
</html>
公共页:(~/Views/Layout/_menu.cshtml)
@{
Layout = "~/Views/Layout/_SiteLayout.cshtml";
}
<h1>
关于我的网站
</h1>
<p>
这是一些内容显示在关于我们这个页面,我们用的是SiteLayout.cshtml这个主页母版页。
<br />
当前时间:@DateTime.Now
</p>
@section menu{
<ul id="sub-menu">
<li>菜单1</li>
<li>菜单2</li>
<li>菜单3</li>
<li>菜单4</li>
</ul>
}
如果在子页面中没有去实现了menu了,则会抛出异常。我们可以它的重载@RenderSection("menu", false)
@if (IsSectionDefined("menu"))
{
@RenderSection("menu", false)
}
else {
<p>menu Section is not defined!</p>
}
4、Helper
@helper就是可以定义可重复使用的帮助器方法,不仅可以在同一个页面不同地方使用,还可以在不同的页面使用。
4.1、新建一个HelperMath.cshtml页面

4.2、HelperMath.cshtml页面写方法
@*求和*@
@helper sum(int a, int b)
{
int result = a + b;
@result
}
4.3、Index.cshtml页面调用
+=@HelperMath.sum(, )<br />
Razor语法和Razor引擎大全的更多相关文章
- Blazor和Vue对比学习(基础1.2):模板语法和Razor语法
Vue使用模板语法,Blazor使用祖传的Razor语法,从逻辑和方向上看,两者极为相似,比如: 都基于HTML 都通过声明式地将组件实例的状态(数据/方法)绑定到呈现的DOM上 都通过指令实现更加丰 ...
- Go汇编语法和MatrixOne使用介绍
目录 MatrixOne数据库是什么? Go汇编介绍 为什么使用Go汇编? 为什么不用CGO? Go汇编语法特点 操作数顺序 寄存器宽度标识 函数调用约定 对写Go汇编代码有帮助的工具 avo tex ...
- OC第五节 ——点语法和@property
一.setter和getter函数 1.回忆:如何访问对象中的成员变量 2.setter和getter函数的作用 setter 方法: 修改对象的字段/实例变 ...
- Markdown 语法和 MWeb 写作使用说明
---恢复内容开始--- # Markdown 语法和 MWeb 写作使用说明 Markdown 的设计哲学 Markdown 的目標是實現「易讀易寫」. 不過最需要強調的便是它的可讀性.一份使用 M ...
- Markdown语法和MWeb使用说明
Markdown 语法和 MWeb 写作使用说明 开始写博客,首先熟悉一下Markdown,以前过看GitHub里的README.MD,感受到了这种文字排版的简洁美观. 写博客是一种有效的学习总结和分 ...
- iOS开发-OC语言 (六)点语法和@property
点语法和@property 知识点 1.setter/getter函数 2.点语法 3.@property语法和属性 ======================================== ...
- Webstorm添加新建.vue文件功能并支持高亮vue语法和es6语法
转载:https://blog.csdn.net/qq_33008701/article/details/56486893 Webstorm 添加新建.vue文件功能并支持高亮vue语法和es6语法 ...
- 好习惯: 用controller as 语法和$inject数组注入
angular好习惯1: 用controller as 语法和$inject数组注入 1) 像普通的JS类一样实现controller,摆脱$scope 2) 用.$inject数组注入相关模块,便于 ...
- [golang] go的typeswitch guard(类型区别)语法和type assertion(类型断言)语法
最近在实现golang,看到个go的特性语法: typeswitch guard. typeswitch guard语法如下: package main import "fmt" ...
随机推荐
- Python知乎热门话题爬取
本例子是参考崔老师的Python3网络爬虫开发实战写的 看网页界面: 热门话题都在 explore-feed feed-item的div里面 源码如下: import requests from py ...
- Centos配置网卡子接口
1.检查OS是否加载802.1q模块: 方法一: [root@rs2 ~]# modinfo 8021q 方法二: [root@rs2 ~]# modinfo -F filename 8021q 方法 ...
- Qt——styleSheet
1.两个地方调用 QWidget::setStyleSheet() QApplication::setStyleSheet() 2.基本语法 selector {attribute : value} ...
- linux 下安装 Cisco Packet Tracer 7.11以及一些注意
https://blog.csdn.net/qq_35882901/article/details/77652571 https://linux.cn/article-5576-1.html 开启登录 ...
- java四种访问权限
java有四种访问权限,它们各自的范围如下图所示 当下列访问修饰符修饰字段和方法时: private 任意位置的子类不可以访问从父类继承的private字段和方法.这里所说的访问包括通过super关键 ...
- linux 网络编程 1---(基本概念)
1.TCP和UDP协议 共同点:同为传输层协议 不同点: TCP:有连接,可靠 UPD 无连接,不保证可靠 TCP(即传输控制协议): 是一种面向连接的传输层协议,它是能提供高可靠性通信(即,数据无误 ...
- LeetCode: 56. Merge Intervals(Medium)
1. 原题链接 https://leetcode.com/problems/merge-intervals/description/ 2. 题目要求 给定一个Interval对象集合,然后对重叠的区域 ...
- 微信小程序学习笔记(1)-微信小程序样式设置逻辑
1.微信小程序的样式设置统一在每一页的.wxss的样式文件中,所有的样式设置代码统一写入这个文件中: 2.样式主要是通过.wxml里面控件的“class”属性来调用,此处调用会有几个细节要注意: 1) ...
- focus如何实现事件委托
事件委托是利用事件冒泡机制的一种优化手段,如果有很多列表元素要绑定事件,那么就可以用事件委托来优化(不需要给每个元素都绑定事件).但是对于focus这种特殊的表单事件,它不会冒泡,那么又该如何实现这一 ...
- hdu1527取石子游戏(威佐夫博弈)
取石子游戏 Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Others)Total Submi ...