如何在ASP.NETCoreMVC中使用Razor视图引擎

ASPX 视图引擎是在 ASP.NET MVC 中构建的传统视图引擎。Razor 视图引擎更高级,现在是 ASP.NET Core MVC 的默认视图引擎。本文简要比较了这两种视图引擎,然后讨论如何在 ASP.NET Core MVC 中使用 Razor 视图引擎。

创新互联建站是网站建设技术企业,为成都企业提供专业的成都网站建设、成都做网站,网站设计,网站制作,网站改版等技术服务。拥有10年丰富建站经验和众多成功案例,为您定制适合企业的网站。10年品质,值得信赖!

要使用本文提供的代码示例,您应该在系统中安装 Visual Studio 2019。

在 Visual Studio 中创建 ASP.NET Core MVC 项目

首先,在 Visual Studio 2019 中创建一个 ASP.NET Core项目。按照这些步骤将在 Visual Studio 2019 中创建一个新的 ASP.NET Core MVC 5 项目。

1. 启动 Visual Studio IDE。

2. 单击“创建新项目”。

3. 在“创建新项目”窗口中,从显示的模板列表中选择“ASP.NET Core Web App (Model-View-Controller)”。

4. 点击“下一步”。

5. 在“配置新项目”窗口中,指定新项目的名称和位置。

6. 根据您的首选项,也可以选中 “将解决方案和项目放置在同一目录中”复选框。

7. 点击“下一步”。

8. 在接下来显示的“附加信息”窗口中,从顶部的下拉列表中选择 .NET 5.0 作为目标框架。将将“Authentication Type”保留为“None”(默认)。

9. 确保“Enable Docker”、“Configure for HTTPS”和“Enable Razor runtime compilation”复选框未选中,因为我们不会在这里使用任何这些特性。

10. 单击“创建”。

将创建一个新的 ASP.NET Core MVC 5 项目。在本文的后续部分中,我们将使用这个项目来处理Razor视图。

什么是视图引擎?

视图引擎将服务器端模板转换为 HTML 标记,并在控制器的操作方法触发时在web浏览器中呈现它。ASP.NET MVC 最初与 ASPX 视图引擎一起提供,但后来的版本中添加了 Razor 视图引擎。Razor 视图引擎现在是 ASP.NET Core MVC 应用程序的默认视图引擎。

虽然 ASPX 视图引擎作为 System.Web.Mvc.WebFormViewEngine 命名空间的一部分可用,但 Razor 视图引擎在 Microsoft.AspNetCore.Mvc.Razor 命名空间中可用。

视图引擎如何工作?

每个视图引擎包含三个组件:ViewEngine 类、view类和模板解析器。ViewEngine 类扩展了 IViewEngine 接口并实现其成员,这个类负责定位视图模板。view类扩展了 IView 接口并实现了其成员。这个类负责将模板与数据结合,然后将其转换为 HTML 标记,以便在 Web 浏览器中呈现。模板解析器是一个将视图编译成可执行代码的解析引擎。

您还可以在 ASP.NET Core 中创建自己的自定义视图引擎。为此,您需要创建一个类,来扩展与 Microsoft.AspNetCore.Mvc.ViewEngines 命名空间相关的 IView 和 IViewEngine 接口。然后实现 IViewEngine 接口的两个方法,即 GetView 和 FindView。还可以实现 IView 接口的 RenderAsync 方法。此方法负责在运行时呈现视图引擎。

在 ASP.NET Core MVC 中创建新的 Razor 视图

在上面创建的新 ASP.NET Core MVC 应用程序中,让我们创建一个简单的视图。为此,请编辑 HomeController.cs 文件并添加以下代码:

 
 
 
 
  1. public IActionResult Welcome(){ 
  2.     ViewData["Message"] = "Hello World!"; 
  3.     return View(); 

接下来,在 Views/Home 文件夹中新建一个名为 Welcome.cshtml 的新视图文件,并输入以下代码:

 
 
 
 
  1. @ViewData [ “Message” ] 

删除 ASP.NET Core MVC 中的默认视图引擎

创建自定义视图引擎时,可以删除 Razor 视图引擎和 ASPX 视图引擎,然后添加自己的自定义视图引擎,如下面给出的代码片段所示。

 
 
 
 
  1. services.AddMvc() 
  2.             .AddViewOptions(options => 
  3.             { 
  4.                 options.ViewEngines.Clear(); 
  5.                 options.ViewEngines.Add(typeof(MyCustomViewEngine)); 
  6.             });  

在 Razor 视图引擎中使用 if 构造

在本节中,我们将研究如何使用 Razor 语法对视图进行编程。让我们首先使用一些常见的结构,例如 if、if else 和 switch case 语句。
以下代码片段演示了如何在Razor中使用if语句。

 
 
 
 
  1. @{var x = 10;}          
  2.           @if (x > 5)  
  3.            {             
  4. The value of x is greater than 5. 
  5.  
  6.            }  
  7.          

下一个代码片段展示了如何在 Razor 中使用 if else 语句。

 
 
 
 
  1. @{var x = 2;}               
  2.           @if (x > 5)  
  3.            {                
  4. The value of x is greater than 5. 
  5.  
  6.            }  
  7.            else  
  8.            {      
  9. The value of x is less than 5. 
  10.  
  11.            }    

在 Razor 视图引擎中使用 switch case 语句

以下是如何在Razor中使用switch case语句。

 
 
 
 
  1. @{ 
  2. var weekday=DateTime.Now.DayOfWeek.ToString(); 
  3. var text=string.Empty; 
  4. @switch(weekday) 
  5. case "Monday": 
  6.     text="This is the first working day of the week."; 
  7.     break; 
  8. case "Friday": 
  9.     text="This is the last working day of the week"; 
  10.     break; 
  11. default: 
  12.     text="Today is: " + weekday; 
  13.     break; 
  14. @text 

如果当天是星期一,当您运行该应用程序时,您将在 Web 浏览器中看到以下输出。

图 1. 运行中的 Razor 视图

在 Razor 视图引擎中使用循环

您可以在 Razor 视图中使用循环来执行重复操作。以下代码片段演示了如何在 Razor 中使用循环。 

 
 
 
 
  1.   
  2.   
  3.      

    Displaying numbers 1 to 10

     
  4.           @for(var i = 1; i <= 10; i++)  
  5.            {               
  6.               

    @i

     
  7.            }  
  8.   
  9.   
  10.    

在处理集合时,可以利用 foreach 循环。以下代码片段演示了如何显示与 Request.Headers 集合相关的所有键。

 
 
 
 
  1.   
  2.  
    •  
    • @foreach (var k in this.Context.Request.Headers) 
    •     { 
    •         
    • @k.Key
    •  
    •     } 
     
  3.  
  4.  

如果想要在视图中使用模型,应该创建一个模型类,如下面给出的代码片段所示。

 
 
 
 
  1. public class Author 
  2.     { 
  3.         public int Id { get; set; } 
  4.         public string FirstName { get; set; } 
  5.         public string LastName { get; set; } 
  6.     }  

为简单起见,在 Models 解决方案文件夹中创建model类。可以在视图中使用此模型,如下面给出的代码片段所示:

 
 
 
 
  1. @model Author      
                
    • Author Id: @Model.Id
    •           
    • First Name: @Model.FirstName
    •           
    • LastName: @Model.LastName
    •       
        

Razor 视图引擎比以前版本更高级,为从模板生成 HTML 代码提供了更友好的语法。请注意,Razor 是一个通用模板引擎——您可以在任何地方使用它来呈现 HTML。
您还可以在 ASP.NET Core MVC 中使用第三方视图引擎,例如 Spark、SharpDOM 和 NDjango。

【译稿,合作站点转载请注明原文译者和出处为.com】

分享名称:如何在ASP.NETCoreMVC中使用Razor视图引擎
标题路径:http://www.mswzjz.com/qtweb/news32/186782.html

网站建设、网络推广公司-创新互联,是专注品牌与效果的网站制作,网络营销seo公司;服务项目有等

广告

声明:本网站发布的内容(图片、视频和文字)以用户投稿、用户转载内容为主,如果涉及侵权请尽快告知,我们将会在第一时间删除。文章观点不代表本网站立场,如需处理请联系客服。电话:028-86922220;邮箱:631063699@qq.com。内容未经允许不得转载,或转载时需注明来源: 创新互联