.ne中的控制器循环出来的数据如何显示在视图上_【asp.net core 系列】3 视图以及视图与控制器...

0.前言

在之前的几篇中,我们大概介绍了如何创建一个http://asp.net core mvc项目以及http请求如何被路由转交给对应的执行单元。这一篇我们将介绍一下控制器与视图直接的关系。

1. 视图

这里的视图不是数据库里的视图,是一种展示技术。在http://asp.net core mvc项目中视图是指以cshtml做扩展名的文件,通常在Views文件夹。

那么现在我们进到之前创建的测试项目 MvcWeb的Views目录下,如果小伙伴们没有做修改的话,能看到如下的目录结构:

├── Home
│   ├── Index.cshtml
│   └── Privacy.cshtml
├── Shared
│   ├── Error.cshtml
│   ├── _Layout.cshtml
│   └── _ValidationScriptsPartial.cshtml
├── _ViewImports.cshtml
└── _ViewStart.cshtml

在Views根目录下,有两个文件分别是:_ViewImports.cshtml_ViewStart.cshtml 两个文件(注意,有个前置下划线)。

1.1 在视图中引用命名空间

我们知道,在cshtml文件中,虽然极大的减少了服务器代码,但是有时候无法避免的使用一些C#代码。那么就会产生一个问题,很多类都有自己的命名空间,如果我们在某个或某几个或某些视图中需要访问这些类和方法,那么一个视图一个视图的写引用有点不太现实,因为这太繁琐了。

所以http://asp.net core mvc 设置了在名为_ViewImports.cshtml的文件中添加引用,则在Views下所有视图中都生效。那么,先来看看这个文件里有啥吧:

@using MvcWeb
@using MvcWeb.Models
@addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers

可以看到,这里引用了项目的命名空间和项目下Modes命名空间的所有内容。因为我们之前创建的测试项目名称就是 MvcWeb。

最后一行是一个 cshtml标记引用,第一个星号表示当前项目的所有TagHelper实现都引用,后面的表示引入http://aps.net core mvc内置的TagHelper。

关于 TagHelper,这篇就先不介绍了。

1.2 ViewsStart

_ViewStart.cshtml 作用从名字中可见一二,这个文件用来配置一些在视图刚开始加载时的一些配置内容。先看一下,默认的里面是什么吧:

@{Layout = "_Layout";
}

先做个介绍,@符号后面用一对大括号包裹,里面是C# 代码。也就是说 Layout = "_Layout",这行的意思是给某个名为Layout的属性设置值为_Layout

那么,Layout的属性是哪里的呢?

对于http://asp.net core mvc而言,一个视图也是一个类只不过这个类是动态生成的,不是一个由程序员编写出来的类,但是这个类继承自:

namespace Microsoft.AspNetCore.Mvc.Razor
{public abstract class RazorPageBase : IRazorPage{}
}

Layout正好是这个类的一个属性,表示视图是否使用了某个布局页。所以上面的代码表示,Views里的新建视图,默认是使用名为_Layout的视图作为布局页。

当然,这个页面不只有这个作用,小伙伴们可以自己尝试下哦。

1.3 视图检索

在上一节中,我们指定了一个布局页的名称。布局页也是视图中的一种,但我们也只指定了名称,但没有指定路径。http://asp.net core是如何发现这个名称的视图呢?

http://asp.net core 会按照以下顺序查找对应的视图文件:

  • Views/[ControllerName]/[ViewName].cshtml
  • Views/Shared/[ViewName].cshtml

所以,_Layout也会按照这个顺序查找,为了避免不必要的混淆,我们只在Shared目录下写了_Layout.cshtml。这也是通常的做法,该文件表示一个全局的布局页。

2. 控制器与视图的关系

在上一篇《【http://asp.net core 系列】2 控制器与路由的恩怨情仇》中,我们介绍了三种创建控制器的方法,并且最后推荐使用名字以Controller结尾并继承Controller类的写法。我将在这里为大家再次讲解为什么推荐这样写:

  • 以Controller结尾,可以很明确的告诉其他人或者未来的自己这是一个控制器,不是别的类
  • 继承Controller,是因为Controller类为我们提供了控制器用到的属性和方法

嗯,暂时就这两点。别看少,但是这很重要。

2.1 使用视图

在之前介绍的时候,有提到过当我们访问一个URL的时候,路由会自动为我们寻找到对应的可执行代码单元。但是,没有进一步内容的介绍。当我们寻找到对应的可执行代码单元也就是Action之后,Action进行一系列的处理,会对这个请求做出响应。有一种响应就是返回一个展示页面,也就是View。

那么,如何返回一个View呢?

创建一个控制器,名为ViewDemoController,并添加一个方法Index,返回类型为IActionResult

using Microsoft.AspNetCore.Mvc;namespace MvcWeb.Controllers
{public class ViewDemoController:Controller{public IActionResult Index(){return View();}}
}

其中 View() 表示返回一个View,这View的名称是 Index,在ViewDemo控制器下。所以,它的路径应该是:

Views/ViewDemo/Index.cshtml

在对应目录创建该文件,然后在文件里随便写一些内容,之后启动项目(项目的端口在第一部分就已经修改过了):

http://localhost:5006 

然后访问:

http://localhost:5006/ViewDemo/

caafad0104eb92546566ee4517e19dfb.png

应该是类似的页面。

IActionResult 是一个接口,表示是一个Action的处理结果,在这里可以理解为固定写法。

2.2 指定视图

在控制器里,View 方法表示使用一个视图进行渲染,默认是使用方法同名的视图。当然,既然是默认的,那就一定有不默认的时候。对的,View方法提供了几个重载版本,这些重载版本里有一个名字为viewName的参数,这个参数就是用来指定视图名称的。

那么,我们可以指定哪些视图名称:

  • 同一个控制器文件夹下的其他视图
  • Shared 文件夹下的视图

这两种都是不用携带路径的视图名,可以省略文件扩展名(cshtml)。

当然,还可以指定其他路径下的视图文件,如:

  • Views/Home/About.cshtml表示从根目录下查找到这个视图,这种写法必须指定扩展名
  • ../Manage/Index 表示在Manage控制器目录下的Index

2.3 给视图传递数据

之前介绍了如何使用视图、如何指定视图名称,但是还缺最关键的一步,那就是如何给视图传递数据。

通常情况下,Action方法中给视图传递数据,只有这三种是推荐的:

  • 使用ViewData
  • 使用ViewDataAttribute
  • 使用ViewBag
  • 使用ViewModel

Controller类有一个属性是 ViewData,它的声明如下:

public ViewDataDictionary ViewData { get; set; }

可以看到这是一个字典型的属性,所以给它赋值是这样使用的:

public IActionResult Index()
{ViewData["Title"] = "ViewDemo";return View();
}

ViewBag也是 Controller类的一个属性,它的声明如下:

public dynamic ViewBag { get; }

可以看到这是一个动态类,实际上ViewBag里的数据与ViewData是互通的,换句话说就是ViewBag是对ViewData的一次封装,两者并没有实际上的区别。赋值使用:

public IActionResult Index()
{ViewBag.Name = "小李";return View();
}

而ViewDataAttribute则与上两个,不太一样,这个属性标注给控制器的属性上,http://asp.net core mvc就会把这个属性的值填充给ViewData,键值就是属性名:

[ViewData]
public string AttributeTest{get;set;}

ViewData["AttributeTest"]效果一致。

在View方法的一些重载版本里,需要一个名为 model的参数,类型是object。这个参数就是一个ViewModel。使用:

在MvcWeb/Models 下添加一个类:

namespace MvcWeb.Models
{public class ViewModelTestModel{public string Name{get;set;}public int Age{get;set;}}
}

回到刚刚的Index方法里,创建一个ViewModelTestModel实例,并传给View方法:

public IActionResult Index()
{ViewData["Title"] = "ViewDemo";ViewBag.Name = "小李";var model = new ViewModelTestModel{Name = "测试实例",Age = 1};return View(model);
}

2.4 在视图中使用

在上一小节中,我们分别使用ViewData和ViewBag以及ViewModel给视图传递了三个数据,那么如何在视图中获取这三个数据呢?

<h2>@ViewData["Title"]</h2>
<!--实际会显示 <h2>ViewDemo</h2>-->

与字典一样,@起头,表示后面跟着一个属性或者一段C#表达式,并将表达式的结果输出到页面上。

ViewBag的访问与ViewData类似,只不过ViewBag是动态对象,可以认为它的类型并没有发生改变,继续按照之前的类型进行使用:

<h4>@ViewBag.Name</h4>

对于ViewModel的使用,View内置了一个dynamic的Model属性,在不做特殊处理的情况下,我们在页面上使用@Model 会得到一个dynamic对象(如果传了ViewModel的话)。虽然也能用,但是这不太友好。

这时候,就需要我们在视图的开头处,添加:

@model ViewModelTestModel

这时候,再使用@Model的时候,就会自动解析成ViewModelTestModel了。

整体Index.cshtml内容如下:

@model ViewModelTestModel
Hello  World!
<h2>@ViewData["Title"]</h2><h4>@ViewBag.Name</h4>
@Model.Name +  @Model.Age

然后重启服务后,刷新页面,会看到类似的内容:

8d2f6e0955f8d95337a9a418ae65ffd1.png

3. 总结

我们在这一篇介绍了视图的一些概念,并介绍了如何使用控制器给视图传递数据。下一篇将讲解一下路由的高级作用,如何通过路由携带数据。

更多内容烦请关注我的博客《高先生小屋》

ec6d62820d83574c0221e162fc980454.png

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/522112.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

为了让开发者写MaxCompute SQL更爽,DataWorks 增强SQL 编辑器功能

摘要&#xff1a; 众所周知&#xff0c;数据开发和分析的同学每天都要花大量时间写MaxCompute SQL&#xff1b;Dataworks作为数据开发的IDE直接影响着大家的开发效率&#xff0c;这次新上线的Dataworks我们在编辑体验上做了很多工作&#xff0c;在前端实现MaxCompute SQL和编辑…

看懂“大数据”,这一篇就够了!

戳蓝字“CSDN云计算”关注我们哦&#xff01;来源 | 鲜枣课堂作者 | 小枣君近年来&#xff0c;大数据这个词的热度很高&#xff0c;受到公众的广泛关注。对于很多人来说&#xff0c;当他第一次听到“大数据”这个词&#xff0c;会自然而然从字面上去理解——认为大数据就是大量…

服务器漏洞处理_wildfly禁用https和8443端口

文章目录一、https和84431. 问题分析1.1. https1.2. 8443端口2. 思路预测3. 解决方案一、https和8443 1. 问题分析 1.1. https 从以上2个漏洞分析&#xff0c;都和8443端口有关&#xff0c;而8443是https的端口&#xff0c;由此分析&#xff0c;和https有关。 1.2. 8443端口…

阿里云MaxCompute被Forrester评为全球云端数据仓库领导者

摘要&#xff1a; 参考消息网3月19日报道 日前&#xff0c;全球权威调研机构佛瑞斯特研究公司&#xff08;Forrester&#xff09;发布《2018年一季度云端数据仓库》报告。报告对大数据服务商的主要功能、区域表现、细分市场和典型客户等进行了全面评估&#xff0c;最终AWS、阿里…

npoi 所有列调整为一页_别再浪费纸了,一张纸就能打印Word、Excel、PPT所有内容,真厉害...

前几天公司的行政小姐姐在整理打印的废纸&#xff0c;不整理不知道&#xff0c;一整理&#xff0c;一个星期浪费的打印纸有几千张&#xff01;&#xff01;&#xff01;现在可是提倡环保啊~这不&#xff0c;现在已经规定每人的打印纸张了&#xff0c;杜绝浪费&#xff0c;从节约…

【HBase从入门到精通系列】如何避免HBase写入过快引起的各种问题

摘要&#xff1a; 首先我们简单回顾下整个写入流程 client api > RPC > server IPC > RPC queue > RPC handler > write WAL > write memstore > flush to filesystem 整个写入流程从客户端调用API开始&#xff0c;数据会通过protobuf编码成一个请求&…

怎么加载csv_python爬虫入门实战(四)!爬取动态加载的页面

今天的主题是爬取动态网页的经验分享&#xff0c;以cocos论坛为例子进行分享。(官方不会打我吧 )配置环境为什么选择cocos论坛呢&#xff1f;因为自己在浏览论坛时&#xff0c;发现标题内容会随着滚动条的位置而动态添加。环境: python3 requests 。还要引入几个系统库。参考如…

再谈全局网HBase八大应用场景

摘要&#xff1a; HBase可以说是一个数据库&#xff0c;也可以说是一个存储。拥有双重属性的HBase天生就具备广阔的应用场景。在2.0中&#xff0c;引入了OffHeap降低了延迟&#xff0c;可以满足在线的需求。引入MOB&#xff0c;可以存储10M左右的对象&#xff0c;完全适应了对象…

文件标识符必须为双精度类型的整数值标量_数据类型

标识符在Java中&#xff0c;标识符多用于类名、方法、字段、变量和包名等&#xff0c;他的命名方式需遵循以下规则&#xff1a;1、标识符可以由字母、数字、__、$组成&#xff0c;但不能包含&#xff01;、#、%、空格等其他特殊字符。2、标识符的命名最好做到见名知意。3、不能…

MSSQL · 最佳实践 · 利用文件组实现冷热数据隔离备份方案

摘要&#xff1a; 摘要 在SQL Server备份专题分享中&#xff0c;前四期我们分享了&#xff1a;三种常见的数据库备份、备份策略的制定、如何查找备份链以及数据库的三种恢复模式与备份之间的关系。本次月报我们分享SQL Server如何利用文件组技术来实现数据库冷热数据隔离备份的…

检测到会话cookie中缺少HttpOnly属性

解决方案01&#xff1a;在会话cookie中添加HttpOnly属性 具体操作步骤如下&#xff1a; HttpServletResponse response2 (HttpServletResponse)response; response2.setHeader( "Set-Cookie", "namevalue; HttpOnly");解决方案02&#xff08;建议使用&am…

刷抖音看到 Python 工程师的工资条后,我沉默了...

戳蓝字“CSDN云计算”关注我们哦&#xff01;最近无意中刷抖音刷到了一个Python工程师的工资条然后我默默的打开看了然后我默默的关闭了emmm.....后悔为什么我当时没有坚持做开发相信每一个人都想拿着高工资做着轻松的工作而如今Python技术盛行大家都纷纷学Python我不能跟你确保…

怎么将sql语句转化成语法树_数据库如何解析执行SQL

阅读文本大概需要3分钟。0x01&#xff1a;数据库客户端发送查询SQL客户端将查询的select sql&#xff0c;按照mysql通信协议传输到数据库服务。数据库服务接受查询sql&#xff0c;执行sql前判断要执行的sql是否是查询语句。0x02&#xff1a;查询缓存先行MySQL在开启查询缓存的情…

佛系程序员的月薪五万指南

摘要&#xff1a; 大师&#xff1a;很简单&#xff0c;我这里有一份佛系月薪 5 万指南&#xff0c;我看你骨骼清奇、脑门光亮&#xff0c;一看就是将要大富大贵之人&#xff0c;这份指南可以助你快速实现小目标&#xff01;程序员问大师…… 青年&#xff1a;大师&#xff0c;你…

数据用压缩 bcd 码 java_IT职场新人选python,go还是java?用数据来说话

最近有读者在后台问&#xff0c;刚参加工作&#xff0c;想选一个职业方法&#xff0c;问我现在python很火&#xff0c;但是貌似就业机会不是很多&#xff0c;所以比较纠结现在到底是学python,go还是java. 所以我就想我们能不能用数据说话&#xff0c;看看python,go,java这三种热…

点击劫持:X-Frame-Options未配置

解决方案&#xff1a;设置X-Frame-Options参数即可 具体操作步骤如下&#xff1a; 在上面filter基础上添加即可解决 httpResp.addHeader("x-frame-options","DENY");附上源码&#xff1a; package com.sinosoft.fis.util;import java.io.IOException; im…

实战:阿里巴巴 DevOps 转型后的运维平台建设

摘要&#xff1a; 阿里巴巴DevOps转型之后&#xff0c;运维平台是如何建设的&#xff1f;阿里巴巴高级技术专家陈喻结合运维自身的理解&#xff0c;业务场景的分析和业界方法论的一些思考&#xff0c;得出来一些最佳实践分享给大家。 前言 “我是这个应用的 Owner”是阿里巴巴D…

华为方舟编译器开源官网正式上线:源代码已开放下载;中兴通讯与北京交通大学、中国移动北京公司签署 “5G战略合作框架协议”……...

关注并标星星CSDN云计算极客头条&#xff1a;速递、最新、绝对有料。这里有企业新动、这里有业界要闻&#xff0c;打起十二分精神&#xff0c;紧跟fashion你可以的&#xff01;每周三次&#xff0c;打卡即read更快、更全了解泛云圈精彩newsgo go go 德创企“空中出租车”首次在…

使用云效在阿里云上进行一站式开发运维

摘要&#xff1a; 云效&#xff0c;一站式企业协同研发云,提供从“需求->开发->测试->发布->运维->运营”端到端的协同服务和研发工具支撑。云效将计划与其他云产品合作&#xff0c;进一步优化一站式体验。 导读 作为一站式企业协同研发云&#xff0c;云效提供…

list按照某个字段排序_恕我直言你可能真的不会java第7篇:像使用SQL一样排序集合

在开始之前&#xff0c;我先卖个关子提一个问题&#xff1a;我们现在有一个Employee员工类。 Data AllArgsConstructor public class Employee {private Integer id;private Integer age; //年龄private String gender; //性别private String firstName; private String la…