ASP.NET Core 的 Razor 语法参考

原文链接：https://learn.microsoft.com/zh-cn/aspnet/core/mvc/views/razor?view=aspnetcore-8.0

Razor 是一种标记语法，用于将基于 .NET 的代码嵌入网页中。 Razor 语法由 Razor 标记、C# 和 HTML 组成。 包含 Razor 的文件通常具有 .cshtml 文件扩展名。 也可在 Razor 组件 文件 (.razor) 中找到 Razor。 Razor 语法类似于各种 JavaScript 单页应用程序 (SPA) 框架（如 Angular、React、VueJs 和 Svelte）的模板化引擎。

 

Razor 支持 C#，并使用 @ 符号从 HTML 转换为 C#。若要对 Razor 标记中的 @ 符号进行转义，请使用另一个 @ 符号：<p>@@Username</p>

包含电子邮件地址的 HTML 属性和内容不将 @ 符号视为转换字符。 Razor 分析不会处理以下示例中的电子邮件地址：

 

隐式 Razor 表达式以 @ 开头，后跟 C# 代码：

<p>@DateTime.Now</p>
<p>@DateTime.IsLeapYear(2016)</p>

 

隐式表达式不能包含空格，但 C# await 关键字除外。 如果该 C# 语句具有明确的结束标记，则可以混用空格：

<p>@await DoSomething("hello", "world")</p>

 

隐式表达式不能包含 C# 泛型，因为括号 (<>) 内的字符会被解释为 HTML 标记。 以下代码无效：

<p>@GenericMethod<int>()</p>

 

显式 Razor 表达式由 @ 符号和平衡圆括号组成。 若要呈现上一周的时间，可使用以下 Razor 标记：

<p>Last week this time: @(DateTime.Now - TimeSpan.FromDays(7))</p>

 

将计算 @() 括号中的所有内容，并将其呈现到输出中。

前面部分中所述的隐式表达式通常不能包含空格。 在下面的代码中，不会从当前时间减去一周：

<p>Last week: @DateTime.Now - TimeSpan.FromDays(7)</p>

该代码呈现以下 HTML：

<p>Last week: 7/7/2016 4:39:52 PM - TimeSpan.FromDays(7)</p>

可以使用显式表达式将文本与表达式结果串联起来：

?
1
2
3
4
5
@{
    var joe = new Person("Joe", 33);
}
 
<p>Age@(joe.Age)</p>

　　以下是ai生成，我觉得更好理解。

Razor 是 ASP.NET MVC 和 ASP.NET Core MVC 中用于创建视图的一种模板引擎，它允许你在 HTML 中嵌入 C# 代码。Razor 视图语法简洁且易于使用，使得开发动态网页变得更加高效。以下是 Razor 视图的一些基本语法和特性：

基本语法

  • 嵌入 C# 代码：

    • 使用 @ 符号来嵌入 C# 代码片段。例如：
      html
      <p>当前时间是 @DateTime.Now.ToString("yyyy-MM-dd HH:mm:ss")</p>
    • 如果 C# 代码是多行的，可以使用 {} 将其包围起来：
      html
      @{
    var name = "Kimi";
}
<p>你好，@name</p>

  • 条件语句：

    • 使用 if 语句来根据条件显示不同的内容：
      html
      @if (Model.IsAdmin)
{
    <p>欢迎管理员</p>
}
else
{
    <p>欢迎用户</p>
}

  • 循环语句：

    • 使用 foreach 或 for 循环来遍历集合或数组：
      html
      @foreach (var item in Model.Items)
{
    <p>@item.Name</p>
}

  • 表达式：

    • 使用 @ 符号直接输出表达式的值：
      html
      <p>总数：@Model.TotalCount</p>

布局和部分视图

  • 布局页面（_Layout.cshtml）：

    • 定义页面的公共结构，如页头、页脚等：
      html
      <!DOCTYPE html>
<html>
<head>
    <title>@ViewBag.Title</title>
</head>
<body>
    <header>网站标题</header>
    <main>
        @RenderBody()
    </main>
    <footer>版权所有</footer>
</body>
</html>
    • 使用 @RenderBody() 来渲染视图的内容。

  • 部分视图（Partial View）：

    • 用于复用视图中的小块内容：
      html
      @Html.Partial("_PartialViewName", Model)
    • 部分视图通常用于显示列表项、表单字段等。

视图模型

  • 使用模型（Model）：

    • 在视图中访问从控制器传递过来的数据：
      html
      @model YourNamespace.YourModelClass
<p>@Model.PropertyName</p>

  • 使用 ViewBag 和 ViewData：

    • 用于传递少量的动态数据：
      html
      <p>@ViewBag.Message</p>

HTML 帮助器

  • HTML 帮助器（Html Helpers）：
    • 提供了一些方便的方法来生成 HTML 元素：
      html
      @Html.TextBoxFor(model => model.Name)
@Html.LabelFor(model => model.Name)
@Html.ValidationMessageFor(model => model.Name)

Razor Pages

  • Razor Pages：
    • ASP.NET Core 2.0 引入了 Razor Pages，它是一种页面模型，允许在页面中直接处理请求：
      html
      @page
@model YourNamespace.YourPageModel
<p>@Model.Message</p>

Razor 视图语法通过将 C# 代码与 HTML 结合，使得开发动态网页变得更加简单和直观。它支持丰富的功能，如布局、部分视图、条件和循环等，能够满足各种复杂的页面需求。

posted @   yinghualeihenmei  阅读(125)  评论(0)  编辑  收藏  举报
相关博文：
· 代码释义@{ Layout = "_Page_List"; }
· .cshtml文件是什么文件，与aspx的区别是什么
· ASP.NET Core 的 Razor 语法
· ASP.NET Core MVC 从入门到精通之Razor语法
· ASP.NET Core 中的 Razor Pages 介绍
阅读排行：
· 分享4款.NET开源、免费、实用的商城系统
· 全程不用写代码，我用AI程序员写了一个飞机大战
· Obsidian + DeepSeek：免费 AI 助力你的知识管理，让你的笔记飞起来！
· MongoDB 8.0这个新功能碉堡了，比商业数据库还牛
· 白话解读 Dapr 1.15：你的「微服务管家」又秀新绝活了
点击右上角即可分享
微信分享提示