ASP.NET Core MVC 控制器可以使用视图返回格式化的结果。

  1.什么是视图

  在 MVC 中,视图封装了用户与应用交互呈现细节。视图是具有生成要发送到客户端内容的,包含嵌入代码的HTML模板。视图使用使用 Razor 语法,该语法允许以最少的代码或复杂度与 HTML 进行交互。

  ASP.NET Core MVC 视图默认以 .cshtml 文件保存在应用程序的 Views 文件夹里面。通常,每个控制器都有自己的文件夹,其中包含对应控制器操作方法的视图。

  除了对应操作的视图,局部视图,布局以及其他特定视图文件可以用来减少重复,并允许在视图中重复使用。

  视图在 MVC 应用程序中提供了关注的分离,将用户界面级标记与业务逻辑分开封装。通常,可以通过 布局与共享指令<layout>或布局视图<partial>对应的用户界面中重复使用。

  2.创建视图  

  属于某个控制器的视图创建在 Views/[ControllerName] 文件夹下。在控制器之间公用的视图则放在 /Views/Shared 文件夹下。将视图命名为与其关联的控制器操作一样的名字,并添加 .cshtml  扩展名。例如,为Home 控制器的 About 操作创建一个视图,则应在 /Views/Home 文件夹下创建一个 About.cshtml 文件,或者在操作方法上右键点击添加视图:

@{
ViewData["Title"] = "About";
}
<h2>@ViewData["Title"]</h2>
<h3>@ViewData["Message"]</h3> <p>Use this area to provide additional information.</p>

  @ 符号代表 Razor 代码。C# 语法在 { } 包裹的 Razor 代码块中运行,Razor 可以通过运用 @ 符号对值进行操作,从而在HTML中显示,就像上面 <h2> 和 <h3> 元素里面展示的那样。

  这个视图只关心由它负责的这部分输出。而页面布局的部分,以及视图中的通用外观,在别的地方指定。

  3.控制器指定视图 

  视图通常作为 ViewResult 从操作返回。操作方法可以直接创建和返回一个 ViewResult ,但一般,如果控制器继承自 Controller ,则只需使用 View 辅助方法即可:

        public IActionResult About()
{
ViewData["Message"] = "Your application description page."; return View();
}

  View 的辅助方法有多个重载,以便于返回视图。可以有选择性地指定一个返回的视图,还可以给视图返回一个模型对象。

  当操作返回视图时,将发生称为视图发现的过程。此过程将确定使用哪个视图文件。除非指定了特定的视图文件,否则运行时首先查找控制器对应的视图,然后在 Share 文件夹中查找匹配的视图名称。

  当操作返回 View 方法时,比如 return View(); 这个操作的名字则被用作视图名称。也可以给这个方法床底一个明确的视图名称 return View("SomeView"); 。这两种情况视图都会在对应控制器的视图文件夹和Share文件夹搜索匹配的文件。

  可以提供视图文件的路径,在这种情况下, .cshtml  扩展名必须指定为文件路径的一部分,return View(“Views/Home/About.cshtml ”);

  4.给视图传递数据

  ASP.NET Core MVC 可以使用多种机制给视图传递数据。最健壮的方式是在视图中指定一个模型类型(通常称为视图模型,以区别于业务领域的模型类型),然后将此类型的实例从操作传递到视图。建议使用模型或视图模型将数据传递到视图。这允许视图利用强类型检查,可以使用 @model 指令为视图指定模型:

@model MVCTest.Models.Operation

@{
ViewData["Title"] = "Create";
} <h2>Create</h2> <h4>Operation</h4>
<hr />
<div class="row">
<div class="col-md-4">
<form asp-action="Create">
<div asp-validation-summary="ModelOnly" class="text-danger"></div>
<div class="form-group">
<label asp-for="Id" class="control-label"></label>
<input asp-for="Id" class="form-control" />
<span asp-validation-for="Id" class="text-danger"></span>
</div>
<div class="form-group">
<label asp-for="Name" class="control-label"></label>
<input asp-for="Name" class="form-control" />
<span asp-validation-for="Name" class="text-danger"></span>
</div>
<div class="form-group">
<input type="submit" value="Create" class="btn btn-default" />
</div>
</form>
</div>
</div> <div>
<a asp-action="Index">Back to List</a>
</div>

  一旦为视图指定了模型,就可以使用 @Model 以强类型方式访问发送到视图的实例。(@Model.Name)上面使用的标签助手。控制器向视图提供实例:

        public ActionResult Create()
{
var model = new Operation()
{
Id=,
Name="test"
};
return View(model);
}

  对于可以作为模型提供给视图的类型没有限制,建议传递具有很少或没有行为的视图模型,以便将业务逻辑封装在应用程序的其他位置。

  1.弱类型数据

  除了强类型视图之外,所有视图都可以访问弱类型的数据集合。此集合可以通过控制器和视图上的 ViewData 或 ViewBag 属性进行引用。ViewBag 属于  ViewData 的一个包装器,它提供了该集合的动态视图,它不是一个单独的集合。

  ViewData 是通过字符串键访问的字典对象,可以在其中存储和检索对象。当提取对象时,需要将它们转化为特定类型。可以使用 ViewData 将数据从控制器传递到视图,以及在视图(局部视图和布局)中传递。字符串可以直接存储和使用,不需要转化:

        public IActionResult About()
{
var model = new Operation()
{
Id=,
Name="test"
};
ViewData["Operation"] = model ; ViewData["Message"] = "Your application description page."; return View();
}

  视图:

@{
ViewData["Title"] = "About";
//需要转化
var operation = ViewData["Operation"] as Operation ;
}
<h2>@ViewData["Title"]</h2>
<h3>@ViewData["Message"]</h3>
<h3>@operation.Id</h3>
<h3>@operation.Name</h3>
<p>Use this area to provide additional information.</p>

  ViewBag 对象提供对存储在 ViewData 中的对象的动态访问,这样可以更方便的使用,因为不需要转换:

@{
ViewData["Title"] = "About"; }
<h2>@ViewData["Title"]</h2>
<h3>@ViewData["Message"]</h3>
<h3>@ViewBag.Operation.Id</h3>
<h3>@ViewBag.Operation.Name</h3>
<p>Use this area to provide additional information.</p>

  由于两者都指向相同的底层 ViewData 集合,因此如果方便,可以在读取和写入值时,在 ViewBag 和 ViewData 之间可以混合使用。

  2.动态视图

  不声明类型,但具有传递给它们的模型实例的视图可以动态引用此实例。但不提供任何编译保护或 IntelliSense 。如果属性不存在,则页面将在运行时出错。

  

  5.更多视图特性

  标签助手可以轻松地将服务器端行为添加到现有地 HTML 标签中,从而避免在视图中使用自定义代码或助手代码。

  生成自定义 HTML 标记可以使用许多内置地 HTML 助手来实现,更复杂地 UI 逻辑(可能具有自己地数据需求)可以封装在视图组件(View Components)中。视图组件提供了与控制器和视图提供的相同的关注点,并且可以消除对于处理由常见UI 元素使用数据的动作和视图的需要。

  视图页支持依赖注入,允许服务注入到视图。(会在后面提到)

 

ASP.NET Core MVC 之视图(Views)的更多相关文章

  1. ASP.NET Core 入门教程 7、ASP.NET Core MVC 分部视图入门

    一.前言 1.本教程主要内容 ASP.NET Core MVC (Razor)分部视图简介 ASP.NET Core MVC (Razor)分部视图基础教程 ASP.NET Core MVC (Raz ...

  2. ASP.NET Core MVC 之视图组件(View Component)

    1.视图组件介绍 视图组件是 ASP.NET Core MVC 的新特性,类似于局部视图,但它更强大.视图组件不使用模型绑定,并且仅依赖于调用它时所提供的数据. 视图组件特点: 呈块状,而不是整个响应 ...

  3. ASP.NET Core 入门笔记8,ASP.NET Core MVC 分部视图入门

    一.前言 1.本教程主要内容 ASP.NET Core MVC (Razor)分部视图简介 ASP.NET Core MVC (Razor)分部视图基础教程 ASP.NET Core MVC (Raz ...

  4. #asp.net core mvc 的视图注入

    View injection is the most useful feature introduced in ASP.NET Core. 1.添加一个FruitsService public cla ...

  5. ASP.NET Core 入门教程 6、ASP.NET Core MVC 视图布局入门

    一.前言 1.本教程主要内容 ASP.NET Core MVC (Razor)视图母版页教程 ASP.NET Core MVC (Razor)带有Section的视图母版页教程 ASP.NET Cor ...

  6. ASP.NET Core MVC 视图

    ASP.NET Core MVC中视图的知识和ASP.NET MVC有很多相似之处,学习难度较低.以下内容主要体现了编程中模块化的思想,模块化才应是我们关注的重点. Layout 布局用于提供各个页面 ...

  7. ASP.NET Core 入门笔记7,ASP.NET Core MVC 视图布局入门

    一.前言 1.本教程主要内容 ASP.NET Core MVC (Razor)视图母版页教程 ASP.NET Core MVC (Razor)带有Section的视图母版页教程 ASP.NET Cor ...

  8. 创建ASP.NET Core MVC应用程序(4)-添加CRUD动作方法和视图

    创建ASP.NET Core MVC应用程序(4)-添加CRUD动作方法和视图 创建CRUD动作方法及视图 参照VS自带的基架(Scaffold)系统-MVC Controller with view ...

  9. ASP.NET Core MVC之ViewComponents(视图组件)

    前言 大概一个来星期未更新博客了,久违了各位,关于SQL Server性能优化会和ASP.NET Core MVC穿插来讲,如果你希望我分享哪些内容可以在评论下方提出来,我会筛选并看看技术文档来对你的 ...

随机推荐

  1. WCSTOMBS 函数不支持中文件的解决方法(设置代码页)

    代码页没有进行设置.需要调用locale.h 中定义的一个函数设置默认的代码页 _tsetlocale(LC_ALL,_T(""));//设置代码页  wcstombs(sendB ...

  2. Qt4.8.6详细安装步骤(使用了i686-4.8.2-release-posix-dwarf-rt_v3-rev3,手动设置gcc和gdb)非常清楚 good

    摘要 在网上查看了很多篇关于Qt 4的安装方法,都是以前很久的帖子,所以就想按自己的方式重新总结一下,希望可以帮助到大家. Qt5的安装比较简单只需要下载一个文件qt-opensource-windo ...

  3. EF Power Tool 代码生成器 反向生成

    大致来说,这个工具有这样几个功能: 1) 按照现有数据库结构,生成Code First POCO class.DbContext class和相应的mapping class. 2) 以designe ...

  4. 07 jQuery的位置信息

    一.宽度和高度 获取宽度 .width() 描述:为匹配的元素集合中获取第一个元素的当前计算宽度值.这个方法不接受任何参数..css(width) 和 .width()之间的区别是后者返回一个没有单位 ...

  5. 深入V8引擎-AST(1)

    没办法了,开坑吧,接下来的几篇会讲述JavaScript字符串源码在v8中转换成AST(抽象语法树)的过程. JS代码在V8的解析只有简单的几步,其中第一步就是将源字符串转换为抽象语法树,非常类似于v ...

  6. 实现h5公众号分享功能(vue项目也适用)

    在vue项目中我们先npm install weixin-js-sdk --save下载下来在main.js文件中引入 import wx from 'weixin-js-sdk';//引入 Vue. ...

  7. Android 即时通讯开发小结(二)

    <Android 即时通讯开发小结>基于IM Andriod 开发的各种常见问题,结合网易云信即时通讯技术的实践,对IM 开发做一个全面的总结. 相关推荐阅读:. Android 即时通讯 ...

  8. vuex分模块后,如何获取state的值

    问题:vuex分模块后,一个模块如何拿到其他模块的state值,调其他模块的方法? 思路:1.通过命名空间取值--this.$store.state.car.list // OK 2.通过定义该属性的 ...

  9. docker安装gitlab-runner

    docker安装gitlab-runner docker pull gitlab/gitlab-runner:latest安装gitlab-runner 打开自己搭建的GitLab网站,点击顶栏的Sn ...

  10. RT-Thread的CPU占用率查看

    今天看到朋友的博客,他在描述RT-Thread钩子函数时,简单提了下RT-Thread中CPU占用,没有具体描述,所以我在这里做下补充. RT-Thread查看CPU使用率时,我知道的有这种方法. 大 ...