ASP.NET MVC 5 学习教程:添加视图-阿里云开发者社区

开发者社区> 老朱教授> 正文

ASP.NET MVC 5 学习教程:添加视图

简介:
+关注继续查看

起飞网 ASP.NET MVC 5 学习教程目录:

在本节内容中,我们将修改HelloWorldController类,使用视图模板来干净利索的封装生成HTML响应客户端的过程。

我们将使用Razor视图引擎创建一个视图模板文件。Razor-based 视图模板文件以.cshtml结尾,提供一种优雅的方式使用C#创建HTML输出。Razor可以使编写模板文件的字符数和按键数降到最低,并可以快速的、流畅的编码。

目前控制器类中的Index方法通过硬编码返回一个字符串消息。修改Index方法使其返回一个View对象,代码如下:

代码清单1:Index方法 - HelloWorldController.cs

public ActionResult Index()
{
    return View();
}

代码清单1中的Index方法使用一个视图模板生成HTML返回给浏览器,控制器方法(也叫做action methods),像Index方法一样,通常返回一个ActionResult(或继承自ActionResult),而不是像字符串一样的原始类型。

首先,为HelloWorld控制器创建一个视图文件夹。右键Views,单击“添加”>“新建文件夹”:

图1:新建文件夹菜单

image

将文件夹命名为 HelloWorld。

在HelloWorld文件夹右键,选择“添加”>“支架”:

图2:添加支架菜单

image

在新建支架对话框中,单击MVC 5 View - Empty without model,然后点击“添加”按钮。

图3:新建支架对话框

image

在Add View对话框中,将视图命名为Index,保持其它项都是默认值,然后单击“Add”按钮。

图4:Add View 对话框

image

文件MvcMovie\Views\HelloWorld\Index.cshtml 已经创建好了。

图5:资源管理器中的Index.cshtml文件

image

下面显示了被创建好的 Index.cshtml文件:

图6:创建好的Index.cshtml文件

image

在<h2>标签下面添加下面的HTML代码:

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

完整的MvcMovie\Views\HelloWorld\Index.cshtml 文件代码如下:

代码清单2:完整的Index.cshtml 文件

@{
    ViewBag.Title = "Index";
}

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

在Index.cshtml上右键,选择“在Page Inspector中查看”。

图7:在Page Inspector中查看菜单

image

更多Page Inspector的内容可以查看Page Inspector tutorial

另外,运行程序,浏览到HelloWorld控制器(http://localhost:xxxx/HelloWorld)。控制器中的Index方法并没有做太多工作,它只是简单的运行了语句 return View(),指定Index方法应该使用一个视图模板文件呈现到浏览器的响应。因为你没有明确指定要使用的视图模板文件的名称,ASP.NET MVC 默认使用\Views\HelloWorld 文件夹下的Index.cshtml文件。下面图片中显示的“Hello from our View Template!”硬编码在视图中。

图8:浏览器中查看HelloWorld视图

image

看起来还不错。但是,注意浏览器标题栏显示的“Index - My ASP.NET Ap”和在页面顶部的大个儿的“Application name”链接。根据你窗口大小不同,你可能会看到右上角的三条杠,点击后会看到 Home、About、Contact、Register和Log in 链接。




本文转自齐师傅博客园博客,原文链接http://www.cnblogs.com/youring2/p/mvc-5-adding-a-view.html,如需转载请自行联系原作者

版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。

相关文章
【HEVC学习与研究】45、HEVC的自适应采样点补偿SAO
1、SAO的意义 在图像中像素值剧烈变化的边界区,经过编码-解码重建之后通常会出现波纹状的失真现象,这种失真称作振铃效应。振铃效应产生的根本原因在于边界区高频分量在编码过程中丢失。
1082 0
订单模块之添加订单之DAO层实现 | 学习笔记
快速学习订单模块之添加订单之DAO层实现
13 0
[Spring MVC] - JSP + Freemarker视图解释器整合(转)
Spring MVC中如果只使用JSP做视图,可以使用下面这段即可解决:   但很多时候我们需要的不只是JSP做view,可能会引用velocity、freemarker等做为view引擎时,需要加入额外的配置。
798 0
【HEVC学习与研究】40、X265的下载和编译
【因工作需要,开始研究一下X265的基本使用方法。由于对HEVC的算法、概念的完全理解尚需时日,因此暂时只是考虑一下如何对x265进行下载、编译和测试方法,内部代码的实现未来再进行研究。
1052 0
Json.Net系列教程 1.Json.Net介绍及实例
原文 Json.Net系列教程 1.Json.Net介绍及实例 本系列教程假设读者已经对Json有一定的了解,关于Json在这里不多说.本系列教程希望能对读者开发涉及到Json的.Net项目有一定的帮 助.本系列教程是根据官方文档资料和自己项目应用汇总而成.如果觉得本系列对你有用,望多多关注.本人还只是个未毕业的学生,水平有限,尽请指正. 一.Json.Net有什么用?   Json.Net是一个读写Json效率比较高的.Net框架.Json.Net 使得在.Net环境下使用Json更加简单。
1108 0
Json.Net系列教程 2.Net类型与JSON的映射关系
原文 Json.Net系列教程 2.Net类型与JSON的映射关系 首先谢谢大家的支持和关注.本章主要介绍.Net类型与JSON是如何映射的.我们知道JSON中类型基本上有三种:值类型,数组和对象.而.
815 0
+关注
3546
文章
0
问答
文章排行榜
最热
最新
相关电子书
更多
《2021云上架构与运维峰会演讲合集》
立即下载
《零基础CSS入门教程》
立即下载
《零基础HTML入门教程》
立即下载