首页 > 编程语言 >无涯教程-ASP.NET Core - Razor布局

无涯教程-ASP.NET Core - Razor布局

时间:2023-10-11 18:32:01浏览次数:41  
标签:Core ASP Layout Razor ViewBag 标签 视图 Index employee

在本章中,无涯教程将了解“Razor Layout”视图,大多数网站和Web应用程序都希望创建呈现一些常见元素的页面。

布局视图

现在了解什么是布局视图。

  • "Layout"视图是扩展名为 *.cshtml 的Razor视图,您可以选择以所需的方式命名布局视图,在本章中,将使用名为 _Layout.cshtml 。

  • 这是"Layout"视图的通用名称,不需要前导下划线,这只是许多开发人员遵循的约定;

  • 这是一种特殊的视图,但是一旦有了"Layout"视图,就可以设置控制器视图,例如主页的"Index"视图。

布局视图
  • 可以将该视图设置为在"Layout"视图内的特定位置进行渲染。

  • "Index"视图仅需要呈现控制器方法提供的该模型的特定内容,而"Layout"视图则负责其他所有内容。

举一个简单的例子。

如果您有多个视图,那么您将看到所有视图将包含一定数量的重复标签,它们都将带有一个开头的 HTML标签,一个 head标签和一个 body标签。

即使在此应用程序中没有导航菜单,但在实际应用程序中也有可能使用它,并且也不想在每个视图中重复该标签。

右键单击Shared文件夹,然后选择Add→New Item。

ASP.NET Add New Item

在中间窗格中,选择" MVC View Layout Page",此处的默认名称是_Layout.cshtml,根据用户选择要在运行时使用的布局视图,现在,单击添加按钮,这是默认情况下将为新的"Layout"视图获得的内容。

Layout Cshtml

无涯教程希望"Layout"视图负责管理head和body。现在,由于此视图位于Razor视图中,因此可以使用C#表达式,仍然可以添加文字文本,现在,有一个显示DateTime.Now的div。现在让添加年份。

<!DOCTYPE html> 
<html> 
   
   <head> 
      <meta name = "viewport" content = "width=device-width" /> 
      <title>@ViewBag.Title</title> 
   </head> 

   <body> 
      <div> 
        @DateTime.Now 
      </div> 
      
      <div> 
        @RenderBody() 
      </div> 
      
   </body> 
</html>

在上面的代码中,您将看到类似 RenderBody 和 ViewBag.Title 的表达式,当MVC控制器操作呈现"Index"视图时,会涉及到一个布局页面,然后将Index视图及其生成的HTML放置在Index视图中。

这是对RenderBody的方法调用所在的位置,可以预期整个应用程序中的所有内容视图都将出现在调用RenderBody的div中。

该文件中的另一个表达式是ViewBag.Title, ViewBag是一种数据结构,可以添加到任何属性以及要添加到ViewBag的任何数据中,可以在ViewBag上添加ViewBag.Title,ViewBag.CurrentDate或任何想要的属性。

现在转到index.cshtml文件。

@model FirstAppDemo.Controllers.HomePageViewModel 
<html xmlns = "http://www.w3.org/1999/xhtml"> 
   
   <head> 
      <title>Home</title> 
   </head> 

   <body> 
      <h1>Welcome!</h1> 
      
      <table> 
         @foreach (var employee in Model.Employees) { 
            <tr> 
               <td> 
                  @Html.ActionLink(employee.Id.ToString(), "Details", new 
                     { id = employee.Id }) 
               </td> 
               <td>@employee.Name</td> 
            </tr> 
         } 
      </table> 
      
   </body> 
</html>

在Index视图中删除不需要的标签,因此,可以删除HTML标签和head标签之类的东西,如以下程序所示。

@model FirstAppDemo.Controllers.HomePageViewModel  
@{  
   ViewBag.Title = "Home"; 
   Layout = "~/Views/Shared/_Layout.cshtml"; 
}
<h1>Welcome!</h1> 
<table> 
   @foreach (var employee in Model.Employees) { 
      <tr> 
         <td> 
            @Html.ActionLink(employee.Id.ToString(), "Details", new { id = employee.Id })
         </td> 
         <td>@employee.Name</td> 
      </tr> 
   } 
</table>

无涯教程仍然需要做两件事-

  • 首先,需要告诉MVC框架要从该视图使用Layout视图。

  • 其次,需要通过在ViewBag中添加一些信息来设置标题,如上面的代码所示。

保存所有文件并运行应用程序。运行该应用程序后,您将看到以下主页。

Home Page

参考链接

https://www.learnfk.com/asp.net_core/asp.net-core-razor-layout-views.html

标签:Core,ASP,Layout,Razor,ViewBag,标签,视图,Index,employee
From: https://blog.51cto.com/u_14033984/7815814

相关文章

  • 无涯教程-ASP.NET Core - 实体框架
    在本章中,无涯教程将设置和配置应用程序以保存和读取SQLServer数据库中的数据。要使用数据库,将使用实体框架,该框架经过了重新编写以与新的.NETFramework一起使用。在此应用程序中,将使用SQLServerLocalDB。LocalDB是为开发人员优化的SQLServer的特殊版本。VisualStudio......
  • intel 4305ue coremark 跑分
    2Kperformancerunparametersforcoremark.CoreMarkSize:666Totalticks:11713Totaltime(secs):11.713000Iterations/Sec:9391.274652Iterations:110000Compilerversion:GCC4.8.520150623(RedHat4.8.5-44)Compilerflags:-O2-DPER......
  • 兆芯6640MA coremark跑分
    2Kperformancerunparametersforcoremark.CoreMarkSize:666Totalticks:13561Totaltime(secs):13.561000Iterations/Sec:8111.496202Iterations:110000Compilerversion:GCC4.8.520150623(RedHat4.8.5-44)Compilerflags:-O2-DPER......
  • NXP ls1021a coremark跑分
    RELEASE版本2Kperformancerunparametersforcoremark.CoreMarkSize:666Totalticks:42504300Totaltime(secs):42.504300Iterations/Sec:2352.703138Iterations:100000Compilerversion:GCC4.9.320150311(prerelease)Compilerflags:-o3......
  • zynq7z030 coremark 跑分
    zynq>./coremarko02Kperformancerunparametersforcoremark.CoreMarkSize:666Totalticks:214430000Totaltime(secs):214.430000Iterations/Sec:466.352656Iterations:100000Compilerversion:GCC4.6.1Compilerflags:-o0Memorylo......
  • 无涯教程-ASP.NET Core - 属性路由
    在本章中,无涯教程将学习另一种路由方法,即基于属性的路由,通过基于属性的路由,可以在控制器类和这些类内部的方法上使用C#属性,这些属性具有告诉ASP.NETCore何时调用特定控制器的元数据。它是基于约定的路由的替代方法。按照出现的顺序,注册的顺序对路由进行判断,但是映射多个路由是......
  • 无涯教程-ASP.NET Core - MVC设置
    在本章中,无涯教程将在FirstAppDemo应用程序设置为MVC框架,将在ASP.NETCore(更具体地说,ASP.NETCoreMVC框架)构建一个Web应用程序,从技术上讲,只能使用中间件来构建整个应用程序,但是ASP.NETCoreMVC提供了可轻松创建HTML页面和基于HTTP的API的功能。要在空项目中设置MVC框架,请遵......
  • 无涯教程-ASP.NET Core - 中间件
    在本章中,无涯教程将了解如何设置中间件(Middleware),ASP.NETCore中间件控制应用程序如何响应HTTP请求。现在假设想将有关每个请求的信息记录到应用程序中。在这种情况下,可能会安装到应用程序中的第一个中间件是日志记录(Logger)组件。该记录器(Logger)可以看到有关传入请求的......
  • tp5 php 阿里OS RequestCoreException: cURL error: SSL certificate problem: certif
    出现这种情况,肯定是域名SSL证书过期。现在出现问题:提交表单出现这种情况,网址不是https的,之前一直也没有问题,一开始想不通网址都不是HTTPS为什么还会有SSL证书的问题,检查了下发现上传中图片是上传到阿里OSS的(https://img.oss.xxx.com),里边就用到了HTTPS域名,原来是这样里,一查发现过......
  • Asp.net core中HttpResponse常用属性及Status code
    在ASP.NETCore中,HttpResponse表示HTTP响应,其中包括一些常用的属性和方法,用于设置HTTP响应的各种属性。HTTP响应通常由一个HTTP状态码,HTTP头(headers),和HTTP主体(body)组成。以下是一些常用的HttpResponse属性和一些常见的HTTP状态码及其含义:HttpResponse常用属性:StatusCode:用......