ASP.NET MVC系列文章

【01】浅谈Google Chrome浏览器(理论篇)

【02】浅谈Google Chrome浏览器(操作篇)(上)

【03】浅谈Google Chrome浏览器(操作篇)(下)

【04】浅谈ASP.NET框架

【05】浅谈ASP.NET MVC运行过程

【06】浅谈ASP.NET MVC 控制器

【07】浅谈ASP.NET MVC 路由

【08】浅谈ASP.NET MVC 视图

【09】浅谈ASP.NET MVC 视图与控制器传递数据

【10】浅谈jqGrid 在ASP.NET MVC中增删改查

【11】浅谈ASP.NET 页面之间传值的几种方式

【12】浅谈缓存技术在ASP.NET中的运用

【13】浅谈NuGet在VS中的运用

【14】浅谈ASP.NET 程序发布过程

【15】浅谈数据注解和验证

【16】浅谈依赖注入

【17】浅谈表单和HTML辅助方法

【18】浅谈基于APS.NET身份验证

【19】浅谈ASP.NET MVC 模型

【20】浅谈ASP.NET MVC 单元测试

【21】浅谈ASP.NET MVC网络安全;

【22】浅谈ASP.NET MVC八大类扩展

【23】再谈ASP.NET MVC Routing

【24】浅谈ASP.NET 高级话题

【25】浅谈大型ASP.NET MVC项目(含DEMO)

【26】下一系列:ASP.NET WebAPI


本篇文章内容属于ASP.NET MVC系列视图篇,主要讲解View,大致内容如下:

1.Views文件夹讲解

2.View种类

3.Razor语法

4.对视图的基本操作

一   Views文件夹

(一) Views文件夹下常用文件种类

分析:

1.ASP.NET MVC页面基本被放在Views文件夹下;

2.利用APS.NET MVC模板生成框架,Views文件夹下的默认页面为.cshtml页面;

3.ASP.NET MVC默认页面为Razor格式的页面,因此默认页面为.cshtml页面;

4.ASP.NET MVC中,支持WebForm页面,即.aspx页面;

5.ASP.NET MVC中,支持静态html页面;

(二) 默认Views文件夹包含内容

分析:

1.这里没添加Account控制器;

2).默认约定:在Controllers新增一个控制器,就会默认地在Views文件夹下新增一个视图问价,用来存放该控制器添加的视图,如上图中增加Home控制器,

在Views下就自动新增加Home文件,用来存放是Home控制器视图;

二 视图种类

(一) 起始视图——_ViewStart.cshtml

分析:

1.打开_ViewStart.cshtml文件,我们发现该文件是引用Shared文件夹下的_Layout.cshtml文件,_Layout.cshtml是什么文件?布局页,稍后将分析;

2.我们来做如下动作

(1)将_ViewStart.cshtml内容注释掉,且添加一个div内容

(2)添加控制器_ViewStartDemoController和Index.cshtml视图

(3)运行程序,访问视图:http://localhost:2016/_ViewStartDemo/Index

分析:

查看html

(二)布局视图

如上,我们分析了_VeiwStart.cshtml文件,我们发现里面有一段代码

@{
Layout = "~/Views/Shared/_Layout.cshtml";
}

不理解这局话不要紧,它采用的Razor语法格式,将稍后与大家分享Razor,但我们看到了_Layout.cshtml文件,该文件即是Views文件夹下,Shared文件夹下的_Layout.cshtml视图

1.查看_Layout.cshtml视图

分析:

(1)_Layout.cshtml基本结构就是HTML基本结构(其实,.aspx和.cshtml结构,均是html结构);

(2)我们发现在<body></body>区域,有两个后台代码:@RenderBody()和@RenderSection()。@RenderBody()表示视图体,@RenderSection()表示部分视图和节点;

(3)我们将程序运行起来,看看

分析:

(1)我们发现最终呈现的页面由两部分组成:Layout.cshtml页面(由_ViewStart.cshtml页面引用_Layout.cshtml页面实现)和Home控制器下的Index页面;

(2)_Layout.cshtml到底是什么?布局页,相当于WebForm的模板页面;

(3)下面我们来定义一个模板页

(三)强类型视图

何为“强类型视图”?Controller向View传递少量数据,一般情况,我们可以归为两大类别:弱类别传递(ViewBag,ViewData,TempData)和强类别传递(强类型视图)。然而,在实际操作中,当涉及大量数据时,

弱类别就显得不是那么方便,此时,一般采用强类型视图。强类型视图一般由三部分构成,即控制器层,视图层和模型层,三者之间调用关系可表示为:

1.创建一个强类型视图

(1)在Model文件夹添加一个UserInfo类

public class UserInfo
{
string UserName { get; set; }
string UserAddress { get; set; }
}

(2)在控制器PartialViewDemo中添加一个方法QiangLeiXing(),并添加视图

(3)强类型视图分析

使用强类型视图,从控制器向视图传递一个在两端都是强类型的模型对象,从那个人获得智能感知、编译检查等好处。在Controller方法中,可以通过向重载的View方法中传递模型实例来指定模型。

 public ActionResult QiangLeiXingView()
{
List<UserInfo> List_UserInfo = new List<UserInfo>();
for (int i = 0; i < 2; i++)
{
List_UserInfo.Add(new UserInfo() { UserName = "Alan_beijing" + i, UserAddress = "上海" + (i++) });
}
ViewBag.List_UserInfo = List_UserInfo;
return View(List_UserInfo);
}

下一步是告知视图哪种类型的模型正在使用@model声明。注意,这里需要输入模型的完全限定名(名称空间和类型名称)

@model IEnumerable<ViewDemo.Models.UserInfo>

对应View

@model IEnumerable<ViewDemo.Models.UserInfo>

@{
Layout = null;
} <!DOCTYPE html> <html>
<head>
<meta name="viewport" content="width=device-width" />
<title>QiangLeiXingView</title>
</head>
<body>
<div>
<ul>
@foreach(ViewDemo.Models.UserInfo V_UserInfo in Model)
{
@V_UserInfo.UserName
@V_UserInfo.UserAddress
<br/>
}
</ul>
</div>
</body>
</html>

当然你也可以采用如下限定

@using ViewDemo.Models
@model IEnumerable<UserInfo>

对应的View

@using ViewDemo.Models
@model IEnumerable<UserInfo> @{
Layout = null;
} <!DOCTYPE html> <html>
<head>
<meta name="viewport" content="width=device-width" />
<title>QiangLeiXingView</title>
</head>
<body>
<div>
<ul>
@foreach(UserInfo V_UserInfo in Model)
{
@V_UserInfo.UserName
@V_UserInfo.UserAddress
<br/>
}
</ul>
</div>
</body>
</html>

2.关于Controller和View之间传值,请参考我的另一篇文章:【ASP.NET MVC】View与Controller之间传递数据

由于本篇文章关于页面之间传值讲得比较详细,因此这里就不分析了。

3.我们来分析一下,为什么使用弱型别来传递不是很方便的原因

关于这个例子,只举例ViewBag(ViewData和TempData差不多原理)

(1)在控制器PartialViewDemo中添加方法

 /// <summary>
/// 弱类型视图,使用ViewBag来传递数据
/// </summary>
/// <returns></returns>
public ActionResult RuoLeiXingView()
{
List<UserInfo> List_UserInfo = new List<UserInfo>();
for (int i = 0; i < 2; i++)
{
List_UserInfo.Add(new UserInfo() { UserName = "Alan_beijing" + i, UserAddress = "上海" });
}
ViewBag.List_UserInfo = List_UserInfo;
return View();
}

(2)在视图中接收数据

@{
Layout = null;
} <!DOCTYPE html> <html>
<head>
<meta name="viewport" content="width=device-width" />
<title>RuoLeiXingView</title>
</head>
<body>
<div>
@foreach(ViewDemo.Models.UserInfo V_UserInfo in (ViewBag.List_UserInfo as IEnumerable<ViewDemo.Models.UserInfo>))
{
@V_UserInfo.UserName
@V_UserInfo.UserAddress
<br />
}
</div>
</body>
</html>

我们发现在枚举之前,需要将动态的ViewBag.List_UserInf 转化为IEnumerable<UserInfo>类型,比较麻烦,当然,你可以使用Dynamic代替

<!DOCTYPE html>

<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>RuoLeiXingView</title>
</head>
<body>
<div>
@foreach(dynamic D_UserInfo in ViewBag.List_UserInfo)
{
@D_UserInfo.UserName
@D_UserInfo.UserAddress
<br />
}
</div>
</body>
</html>  

使用Dynamic似乎方便了许多,但细心的你可能已经发现,变量没有了智能感应功能。

到此,大家应该明白了ViewBag的不方便性了,当然,细心的你又会发现,强类型视图,刚好具备如上两个优势。

(四)部分视图

何为“分布视图”?在WebForm开发中,我们经常用到用户自定义控件,其作用是提高代码的复用性,减少代码的冗余,使程序更加模块化,那么,在ASP.NET MVC中,对应地引入了基于Razor结构的分布页,其作用与

WebForm开发中的用户自定义控件差不多。

1. 创建分布页

我们在/Views/Shared文件夹下创建一个分布页_PartialPageDemo.cshtml,并向该页面中添加一段代码:

<h1 style="color:red">我是分布页</h1>

创建过程如下:

2.调用分布页

(1) 添加控制器PartialViewDemo和视图Index.cshtml

(2)在Index.cshtml页面中调用_PartialPageDemo.cshtml

3.调用分布页的几种方式

方式一:

@Html.Partial()

方式二:

@Html.Action()

方式三:

通过Ajax方式调用;

三  Razor语法

Razor视图引擎是ASP.NET MVC3中新扩展的内容,并且也是他的默认视图引擎,其设计理念是:简单直观。Razor视图引擎可分为MVC和WebForm视图引擎,基于篇幅限制,本文只分析MVC Razor视图引擎。Razor中的核心转

换符"@",代表:标记-代码或代码-标记的意思。一般有两种基本转换,即代码表达式和代码块。

(一)代码表达式

1.支持隐式代码表达式求解

这个特性,在强类型视图中,体现得很明显。

<div>
<ul>
@foreach(UserInfo V_UserInfo in Model)
{
@V_UserInfo.UserName
@V_UserInfo.UserAddress
<br/>
}
</ul>
</div>

2.支持显示代码表达式

<div>1+2=@(1+2)<div>

3.Razor十分智能,可以知道表达后面的空格字符不是一个有效的标识符,所以它可以顺畅地转回到标记语言。

4.自动识别邮件格式

会自动识别邮件,而并不是当作变量。

<div>@www.qq.com</div>

5.支持文本量

@{

      string  BlogName="Alan_beijing";
}
<div>@BlogName.Views</div>

这段代码回提示错误,提示string没有Views属性。

其实我们想要输出的结果:Alan_beijing.Views,但@BlogName.Views  ,View被解析为BlogName的一个属性,因此出错,此时,应用字面量

@{

      string  BlogName="Alan_beijing";
}
<div>@(BlogName).Views</div>

6.支持转义字符

如我想输出:@Alan_beijing

<div>@@Alan_beijing</div>

(二)支持HTML编码

我们知道,在防止XSS攻击时了(跨站脚本注入攻击) ,首先要做到HTML编码,Razor刚好是HTML编码的。

@{

     string message="<script>alert('haacked!')</script>";

}
<span>@message<span>

这段代码不会弹出警告框而只会呈现编码的HTML

<span>&alt;script>alert('haacked!');&alt;/script></span>

这里不论述这个,后在【ASP.NET MVC系列】的后续篇幅中,专门讲解。

(三) 代码块

这个大家应该用的比较多,foreach

<div>
<ul>
@foreach(UserInfo V_UserInfo in Model)
{
@V_UserInfo.UserName
@V_UserInfo.UserAddress
<br/>
}
</ul>
</div>

四  对视图的基本操作

ASP.NET MVC 提供的模板中,当创建View时,提供了六种模型,分别为Create,Delete,Detail,Edit,Empty,Empty(不具有模型),List。基于该模型,我们可以轻松地创建具体实体的增删改查。由于比较简单,本例只

简单结合UserInfo实体演示Create,其他操作,请读者自行操作,原理思路一样,这里不一 一论述。

我们创建一个基础UserInfo实体的Create

测试结果

四   参考文献

【01】【01】ASP.NET MVC5 高级编程(Jon Galloway,Brad Wilson,K.Scott Allen,David Matson ,孙远帅 译)

【02】APS.NET MVC4

五  版权区

  • 感谢您的阅读,若有不足之处,欢迎指教,共同学习、共同进步。
  • 博主网址:http://www.cnblogs.com/wangjiming/。
  • 极少部分文章利用读书、参考、引用、抄袭、复制和粘贴等多种方式整合而成的,大部分为原创。
  • 如您喜欢,麻烦推荐一下;如您有新想法,欢迎提出,邮箱:2016177728@qq.com。
  • 可以转载该博客,但必须著名博客来源。

【ASP.NET系列】详解Views的更多相关文章

  1. ASP.NET ViewState详解

    ASP.NET ViewState详解[转载] 作者:Infinities Loop 概述 ViewState是一个被误解很深的动物了.我希望通过此文章来澄清人们对ViewState的一些错误认识.为 ...

  2. QAction系列详解

    QAction系列详解 一.QAction类详解 [详细描述] QAction类提供了抽象的用户界面action,这些action可以被放置在窗口部件中.        应用程序可以通过菜单,工具栏按 ...

  3. MySQL系列详解八:MySQL多线程复制演示-技术流ken

    前言 Mysql 采用多线程进行复制是从 Mysql 5.6 开始支持的内容,但是 5.6 版本下有缺陷,虽然支持多线程,但是每个数据库只能一个线程,也就是说如果我们只有一个数据库,则主从复制时也只有 ...

  4. ASP.NET Session详解(转)

    ASP.NET Session详解 本文章来自:http://blog.163.com/adam601@126/blog/static/22506317200932824210996/ 当用户在 We ...

  5. iOS开发技巧系列---详解KVC(我告诉你KVC的一切)

    KVC(Key-value coding)键值编码,单看这个名字可能不太好理解.其实翻译一下就很简单了,就是指iOS的开发中,可以允许开发者通过Key名直接访问对象的属性,或者给对象的属性赋值.而不需 ...

  6. MySQL系列详解六:MySQL主从复制/半同步演示-技术流ken

    前言 随着技术的发展,在实际的生产环境中,由单台MySQL数据库服务器不能满足实际的需求.此时数据库集群就很好的解决了这个问题了.采用MySQL分布式集群,能够搭建一个高并发.负载均衡的集群服务器.在 ...

  7. MySQL系列详解三:MySQL中各类日志详解-技术流ken

    前言 日志文件记录了MySQL数据库的各种类型的活动,MySQL数据库中常见的日志文件有 查询日志,慢查询日志,错误日志,二进制日志,中继日志 .下面分别对他们进行介绍. 查询日志 1.查看查询日志变 ...

  8. OpenStack计费项目Cloudkitty系列详解(一)

    云计算是一种按需付费的服务模式,虽然OpenStack前期在计量方面走了些“弯路”,但现在的ceilometer.gnocchi.aodh.panko项目的稳步并进算是让其峰回路转.然而,目前来看Op ...

  9. 阿里云系列——7.阿里云IIS系列详解(过程+通用+最新)

    网站部署之~阿里云系列汇总 http://www.cnblogs.com/dunitian/p/4958462.html 先讲IIS系列,Linux部署以后再继续讲 先打开主机管理平台,确认域名绑定 ...

随机推荐

  1. C语言之循环计数

    #include<stdio.h>int main(){int num,count=0,i=0;scanf("%d",&num);num/=10;count++ ...

  2. selenium基本操作

    #coding=utf-8from selenium import webdriverfrom selenium.webdriver.common.keys import Keysfrom selen ...

  3. 小程序采坑系列-this.setData

    今天踩了大坑,坑里还都是碎瓶渣子.. 先说一下基本使用.官网也有. 比如说你在main.js里面有这些变量.想修改某些值. data: { main_view_bgcolor: "" ...

  4. openstack pike 单机 一键安装 shell

    #openstack pike 单机  centos 一键安装 shell #openstack pike 集群高可用  安装部署 汇总 http://www.cnblogs.com/elvi/p/7 ...

  5. 企业级分布式监控系统-Zabbix基础

    1.基础分部 1.1Zabbix简介 Zabbix 是一个企业级的分布式开源监控方案. 1.2监控系统架构 C/S架构 客户端/服务器端,这种架构适合规模较小,处于同一地域的环境 C/P/S 客户端/ ...

  6. 怎么配置Jupyter Notebook默认启动目录?

    前言 系统环境:win10 x64:跟环境也没啥关系,在LInux下也一样... 前段时间重换了系统后,发现Jupyter Notebook的默认启动目录不太对呀,所以,就翻到了以前的笔记,还是记在这 ...

  7. PHP如何强制下载文件

    很多网站都需要做文件下载的功能.如果直接给连接的方式下载的话有很多的弊处...因为有时候需要对下载权限的检查,对下载次数的检查.所以一般采用php的方法进行安全下载.但是下载的时候如果是txt jpg ...

  8. iBeacon硬件厂商和产品

    最近项目比较忙,也没有时间写Blog. 这几天因为项目需要采购为数不小的iBeacon,所以花了点时间对市面上主要的iBeacon简单的调研总结了一下. 分享给需要买相关设备进行试验的小伙伴,数据不权 ...

  9. c++对象在lua层的生命周期与内容扩展

    前言 上一篇博客记录了 tolua++ 将 c++类型,变量,函数,以及对象导出到 lua 的过程,这篇博客就接着记录一下 c++对象的内存回收以及c++对象数据和方法在lua中的扩展. 首先 tol ...

  10. 表单的自动到json与urlstr

    将表单序列化成json,将json转换成字符串 //将表单序列化成json 字符串 $.fn.serializeObject = function(){ var obj = {}; var count ...