您的位置：首页 > 编程语言 > ASP

ASP.NET MVC5(2)视图

2015-08-09 14:42 579 查看

使用了ASP.NET MVC 3所引入的Razor视图引擎（Razor
view engine）。Razor视图模板文件使用.cshtml文件扩展名，并提供了一个优雅的方式来使用C＃语言创建所要输出的HTML。用Razor编写一个视图模板文件时，将所需的字符和键盘敲击数量降到了最低，并实现了快速，流畅的编码工作流程。

前在控制器类中的Index方法返回了一个硬编码的字符串。更改Index方法返回一个View对象，如下面的示例代码：

public ActionResult Index()

{

return View();

}

上面的Index方法使用一个视图模板来生成一个HTML返回给浏览器。

添加下面的高亮标记代码。建立一个视图模板

@{

Layout = "~/Views/Shared/_Layout.cshtml";//指定可以共享的布局页面

}

@{

ViewBag.Title = "Index";//浏览器中显示的标题

}

<h2>Index</h2>

<p>Hello from our View Template!</p>

同时，运行应用程序并在浏览器中浏览：HelloWorld控制器（http://localhost:xxxx/HelloWorld“）。在您控制器的Index方法中并没有做太多的工作，它只是执行了return View()，这个方法指定使用一个视图模板文件来Render返回给浏览器的HTML。因为您没有明确指定使用那个视图模板文件，ASP.NET MVC会默认使用\Views\HelloWorld文件夹下的Index.cshtml视图文件。下图显示了在视图文件中硬编码的字符串
"Hello from our View Template!"

为什么显示是这个效果呢？

在解决方案资源管理器里找到/Views/Shared文件夹，打开_Layout.cshtml文件。此文件被称为布局页面（Layout
page），并且其它所有的子页面，都共享使用这个布局页面。布局模板中提供了一个占位符，来占位各自不同页面的特殊部分。，RenderBody只是个占位符

完整的布局文件如下所示：

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8" />

<meta name="viewport" content="width=device-width, initial-scale=1.0">

<title>@ViewBag.Title - Movie App</title><!-- 拼接而成的-->

@Styles.Render("~/Content/css")

@Scripts.Render("~/bundles/modernizr")

</head>

<body>

<div class="navbar navbar-inverse navbar-fixed-top">

<div class="container">

<div class="navbar-header">

<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">

<span class="icon-bar"></span>

<span class="icon-bar"></span>

<span class="icon-bar"></span>

</button>

@Html.ActionLink("MVC Movie", "Index", "Movies", null, new { @class = "navbar-brand" })

</div>

<div class="navbar-collapse collapse">

<ul class="nav navbar-nav">

<li>@Html.ActionLink("Home", "Index", "Home")</li>

<li>@Html.ActionLink("About", "About", "Home")</li>

<li>@Html.ActionLink("Contact", "Contact", "Home")</li>

</ul>

@Html.Partial("_LoginPartial")

</div>

</div>

</div>

<div class="container body-content">

@RenderBody()   占位符

<hr />

<footer>

<p>© @DateTime.Now.Year - My ASP.NET Application</p>

</footer>

</div>

@Scripts.Render("~/bundles/jquery")

@Scripts.Render("~/bundles/bootstrap")

@RenderSection("scripts", required: false)

</body>

</html>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航