ASP.NET MVC教程四:ASP.NET MVC中页面传值的几种方式

准备

在Models文件夹里面新添加Student实体类,用来模拟从Controller向View传递数据,Student类定义如下:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;namespace MVCStudyDemo.Models
{public class Student{public int ID { get; set; }public string Name { get; set; }public int Age { get; set; }public string Sex { get; set; }public string Email { get; set; }}
}

一、通过ViewData传值

MVC从开始版本就一直支持使用ViewData将Controller里面的数据传递到View。ViewData定义如下:

从上面的截图中可以看出,ViewData里面存的是字典类型的数据,在查看ViewDataDictionary的定义:

注意:ViewDataDictionary继承自IDictionary等接口,所以ViewData里面的Value值类型是object的,使用的时候需要进行类型转换。

新建Controller,并命名为ViewDataDemo,该Controller用来模拟通过ViewData向View传递数据

Controller代码如下:

using MVCStudyDemo.Models;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;namespace MVCStudyDemo.Controllers
{public class ViewDataDemoController : Controller{// GET: ViewDataDemo/// <summary>/// 通过ViewData向对应的View传递数据/// </summary>/// <returns></returns>public ActionResult Index(){// 1、将字符串传递到ViewViewData["Other"] = "通过ViewData向View传递字符串";// 2、通过KeyValuePair添加ViewData.Add(new KeyValuePair<string, object>("name","tom"));// 3、直接添加ViewData.Add("age", 23);// 4、传递集合到ViewViewData["Data"] = new List<Student>(){new Student{ID = 1,Name = "唐僧",Age = 34,Sex = "",Email = "747976523@qq.com"},new Student{ID = 2,Name = "孙悟空",Age = 635,Sex = "",Email = "sunwukong@163.com"},new Student{ID = 3,Name = "白骨精",Age = 4532,Sex = "",Email = "74345523@qq.com"}};// 返回同名的视图return View();}}
}

 对应的View视图代码如下:

@*引入Student的命名空间*@
@using MVCStudyDemo.Models;
@{ViewBag.Title = "Index";// 这里使用的是Razor语法,写的是后台C#代码// ViewData的Value值是Object类型的,需要进行类型转换// 常规写法是先在这里进行类型转换var list = ViewData["Data"] as List<Student>;
}<h2>通过ViewData向View传递数据</h2>
<div class="jumbotron"><div><div>1、传递字符串 other:@ViewData["Other"];</div><div>2、传递字符串 name:@ViewData["name"];</div><div>3、传递字符串 age:@ViewData["age"];</div><div>4、传递集合方式一@foreach (var item in list){<div>ID:@item.ID&nbsp;&nbsp;Name:@item.Name&nbsp;&nbsp;Age:@item.Age&nbsp;&nbsp;Sex:@item.Sex&nbsp;&nbsp;Email:@item.Email</div>}</div><div>5、传递集合方式二@foreach (var item in ViewData["Data"] as List<Student>){<div>ID:@item.ID&nbsp;&nbsp;Name:@item.Name&nbsp;&nbsp;Age:@item.Age&nbsp;&nbsp;Sex:@item.Sex&nbsp;&nbsp;Email:@item.Email</div>}</div></div>
</div>

 运行结果:

二、通过ViewBag传值

ViewBag是在MVC3中出现的,ViewBag是动态(dynamic)类型的。

新建Controller,并命名为ViewBagDemo,该Controller用来模拟通过ViewBag向View传递数据。

Controller代码:

using MVCStudyDemo.Models;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;namespace MVCStudyDemo.Controllers
{public class ViewBagDemoController : Controller{// GET: ViewBagDemo/// <summary>/// 通过ViewBag向View传递数据/// </summary>/// <returns></returns>public ActionResult Index(){// 通过ViewData传值ViewData["name"] = "ViewData";// 传递集合到ViewViewData["Data"] = new List<Student>(){new Student{ID = 1,Name = "唐僧",Age = 34,Sex = "",Email = "747976523@qq.com"},new Student{ID = 2,Name = "孙悟空",Age = 635,Sex = "",Email = "sunwukong@163.com"},new Student{ID = 3,Name = "白骨精",Age = 4532,Sex = "",Email = "74345523@qq.com"}};// 通过ViewBag传值ViewBag.Name = "ViewBag";ViewBag.StudentData = new Student(){ID = 5,Name = "沙悟净",Age = 567,Sex = "",Email = "4567890345@qq.com"};// 返回同名视图return View();}}
}

对应的Index视图代码:

@*引入Student的命名空间*@
@using MVCStudyDemo.Models;
@{ViewBag.Title = "Index";// ViewBag是dynamic类型的,使用的时候不需要进行类型转换var stu = ViewBag.StudentData;var stuList = ViewBag.Data;
}<h2>通过ViewBag向View传递数据</h2>
<div class="jumbotron"><div><div>Controller通过ViewBag向View传递数据</div><div>1、通过ViewData传递字符串 ViewData["name"]:@ViewData["name"];</div><div>2、通过ViewBag传递字符串 ViewBag.name:@ViewBag.Name;</div><div>3、输出stu<div>ID:@stu.ID&nbsp;&nbsp;Name:@stu.Name&nbsp;&nbsp;Age:@stu.Age&nbsp;&nbsp;Sex:@stu.Sex&nbsp;&nbsp;Email:@stu.Email</div>4、输出stuList@foreach (var item in stuList){<div>ID:@item.ID&nbsp;&nbsp;Name:@item.Name&nbsp;&nbsp;Age:@item.Age&nbsp;&nbsp;Sex:@item.Sex&nbsp;&nbsp;Email:@item.Email</div>}</div></div>
</div>

 运行结果;

看了上面的运行结果,你可能会提出如下的两个疑问:

1、Controller里面没有定义ViewBag.Data,为什么在这里可以使用呢?

这是因为ViewBag是从MVC3版本才开始出现的,为了兼容以前的ViewData,所以这里虽然没有定义ViewBag.Student,但是ViewBag可以使用ViewData里面定义的Data数据。

2、ViewData["name"]和ViewBag.name的值是一样的

在控制器里面明明设置的两个值是不同的,但是为什么这里都变成一样的了呢?这是因为ViewData和ViewBag的属性是重叠的,两者都是字典类型的,一切以后面定义的属性为准,即后面定义的会覆盖前面定义的。

修改Controller代码,将ViewData的顺序放到ViewBag后面:

using MVCStudyDemo.Models;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;namespace MVCStudyDemo.Controllers
{public class ViewBagDemoController : Controller{// GET: ViewBagDemo/// <summary>/// 通过ViewBag向View传递数据/// </summary>/// <returns></returns>public ActionResult Index(){// 通过ViewData传值//ViewData["name"] = "ViewData";// 传递集合到ViewViewData["Data"] = new List<Student>(){new Student{ID = 1,Name = "唐僧",Age = 34,Sex = "",Email = "747976523@qq.com"},new Student{ID = 2,Name = "孙悟空",Age = 635,Sex = "",Email = "sunwukong@163.com"},new Student{ID = 3,Name = "白骨精",Age = 4532,Sex = "",Email = "74345523@qq.com"}};// 通过ViewBag传值ViewBag.Name = "ViewBag";ViewBag.StudentData = new Student(){ID = 5,Name = "沙悟净",Age = 567,Sex = "",Email = "4567890345@qq.com"};// 把ViewData的顺序放到ViewBag后面ViewData["name"] = "ViewData";// 返回同名视图return View();}}
}

 在查看Index视图显示效果:

这时会发现,Index视图里面显示的都是ViewData的值了。

三、通过TempData传值

新建Controller,并命名为TempDataDemo,该Controller用来模拟通过TempData向View传递数据。

Controller代码:

using MVCStudyDemo.Models;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;namespace MVCStudyDemo.Controllers
{public class TempDataDemoController : Controller{// GET: TempDataDemopublic ActionResult Index(){// ViewDataViewData["Name"] = "tom";// ViewBageViewBag.Name = "Jon";// TempDataTempData["Name"] = "Andi";TempData["Stu"] = new Student(){ID = 5,Name = "沙悟净",Age = 567,Sex = "",Email = "4567890345@qq.com"};// 返回同名视图return View();}}
}

 对应的Index视图代码:

@*引入Student的命名空间*@
@using MVCStudyDemo.Models;
@{ViewBag.Title = "Index";
}
@{// 类型转换var stu = TempData["Stu"] as Student;
}<h2>通过TempData向View传递数据</h2>
<div class="jumbotron"><p><div><div>通过ViewData传递字符串 ViewData["Name"]:@ViewData["Name"];</div></div></p><p><div><div>通过ViewBag传递字符串 ViewBag.Name:@ViewBag.Name;</div></div></p><p><div><div>1、传递字符串 TempData["Name"]:@TempData["Name"];</div>2、输出stu<div>ID:@stu.ID&nbsp;&nbsp;Name:@stu.Name&nbsp;&nbsp;Age:@stu.Age&nbsp;&nbsp;Sex:@stu.Sex&nbsp;&nbsp;Email:@stu.Email</div></div></p>
</div>

 运行结果:

从上面的结果中可以看出:TempData的属性值不会覆盖上面定义的属性值。那TempData还有什么作用呢?在看下面的代码:

using MVCStudyDemo.Models;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;namespace MVCStudyDemo.Controllers
{public class TempDataDemoController : Controller{// GET: TempDataDemopublic ActionResult Index(int? id){// ViewDataViewData["Name"] = "tom";// ViewBageViewBag.Name = "Jon";// TempDataTempData["Name"] = "Andi";TempData["Stu"] = new Student(){ID = 5,Name = "沙悟净",Age = 567,Sex = "",Email = "4567890345@qq.com"};if(id==null){// 跳转到TempDataTest方法return RedirectToAction("TempDataTest");}else{// 返回同名视图return View();}          }public ActionResult TempDataTest(){// 返回同名视图return View();}}
}

 TempDataTest视图代码:

@*引入Student的命名空间*@
@using MVCStudyDemo.Models;
@{ViewBag.Title = "TempDataTest";// 类型转换var stu = TempData["Stu"] as Student;
}<h2>TempDataTest</h2>
<h3>ViewData["Name"]:@ViewData["Name"]</h3>
<h3>ViewBage.Name:@ViewBag.Name</h3>
<h3>TempData["Name"]:@TempData["Name"];</h3>
<h3>ID:@stu.ID&nbsp;&nbsp;Name:@stu.Name&nbsp;&nbsp;Age:@stu.Age&nbsp;&nbsp;Sex:@stu.Sex&nbsp;&nbsp;Email:@stu.Email</h3>

 在浏览器里面输入下面的URL地址:http://localhost:9080/TempDataDemo/index,这就表示传递的id是null值,运行结果:

你会发现这时ViewData和ViewBag都取不到数据了,只有TempData可以取到数据,可以得出TempData和ViewData、ViewBag的区别:

TempData是基于session存储的,单次请求数据不丢失(ViewData和ViewBag会丢失),后台跨页面传值,只能用一次

四、Model传值

在Action放过里面的View上面F12转到定义:

可以看到View有很多重载,其中一种可以直接传递model,如上面截图中红框所示。

新建Controller,并命名为ModelDemo,该Controller用来模拟通过Model向View传递数据。

对应的controller代码:

using MVCStudyDemo.Models;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;namespace MVCStudyDemo.Controllers
{public class ModelDemoController : Controller{// GET: ModelDemopublic ActionResult Index(){Student student = new Student(){ID = 5,Name = "沙悟净",Age = 567,Sex = "",Email = "4567890345@qq.com"};// 返回modelreturn View(student);// 或者直接返回//return View(new Student()//{//    ID = 5,//    Name = "沙悟净",//    Age = 567,//    Sex = "男",//    Email = "4567890345@qq.com"//});
        }}
}

 Index视图代码:

@{ViewBag.Title = "Index";
}<h2>通过Model向View传值</h2>
<h3>ID:@Model.ID</h3>
<h3>Name:@Model.Name</h3>
<h3>Age:@Model.Age</h3>
<h3>Sex:@Model.Sex</h3>
<h3>Email:@Model.Email</h3>

  运行结果:

 

转载于:https://www.cnblogs.com/dotnet261010/p/11416941.html

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

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

相关文章

量子计算,后摩尔时代计算能力提升的解决方案

来源&#xff1a;微信公众号蓝海长青智库原载于《学习时报》2022年3月2日刊作者&#xff1a;朱晓波1、陆朝阳1、潘建伟2,31 中科学技术大学合肥微尺度物质科学国家研究中心2 中国科学院院士3 中国科学技术大学量子计算是基于量子力学的全新计算模式&#xff0c;具有原理上远超经…

ASP.NET MVC教程六:两个配置文件详解

前言 在新建完一个MVC项目之后&#xff0c;你会发现整个整个项目结构中存在有两个web.config文件&#xff0c;如下图所示&#xff1a; 这两个配置文件&#xff0c;一个位于项目的根目录下面&#xff0c;一个位于Views文件夹下面&#xff0c;这两个配置文件有什么不同呢&#xf…

Nat. Commun. 速递:虚拟颅内脑电与神经动力学模型

来源&#xff1a;集智俱乐部作者&#xff1a;曹淼 编辑&#xff1a;邓一雪 导语时间-空间尺度动态演变的动力学系统建模&#xff0c;为研究大脑状态和状态转移的神经机制提供了理论基础。最近墨尔本大学曹淼等人的联合团队在Nature Communications发表论文&#xff0c;提出了虚…

ASP.NET MVC教程五:ASP.NET MVC中的路由

一、概述 在ASP.NET MVC架构中&#xff0c;控制器在3大核心构件中处于中心地位&#xff0c;通过控制器支配模型和视图&#xff0c;然而从浏览器发出的请求到控制器还需要路由的协助&#xff0c;路由将特定的请求和控制器的动作对应起来。 在ASP.NET MVC程序中&#xff0c;路由主…

一文梳理深度学习算法演进

来源&#xff1a;https://zhuanlan.zhihu.com/p/464515049作者&#xff1a;Peter潘欣编辑&#xff1a;蘑菇先生学习记涉及语音、图像、nlp、强化学习、隐私保护、艺术创作、目标检测、医疗、压缩序列、推荐排序等方向。文章较长&#xff0c;耐心读完会有收获。1. 前言如果说高德…

ASP.NET MVC教程八:_ViewStart.cshtml

一、引言 _ViewStart.cshtml是在ASP.NET MVC 3.0及更高版本以后出现的&#xff0c;用Razor模板引擎新建项目后&#xff0c;Views目录下面会出现一个这样的文件&#xff1a; 打开_ViewStart.cshtml文件&#xff0c;里面只有一行代码&#xff1a; 这行代码表示使用Views文件夹下的…

2021年全球十大工程成就,中国有几个? | 科技袁人

来源&#xff1a; 风云之声视频链接&#xff1a;西瓜视频&#xff1a;https://www.ixigua.com/7068180516549329415本视频发布于2021年2月25日&#xff0c;观看量已达7.4万次精彩呈现&#xff1a;2021年&#xff0c;中国工程院院刊《Engineering》组织了一个“全球十大工程成就…

formSelects-v4.js 基于Layui的多选解决方案

详情链接地址&#xff1a; https://hnzzmsf.github.io/example/example_v4.html#select_search_server1、闲谈杂趣v3传送门 v3文档其实思考了很久, 还是放弃了v3, 因为开发v3的时候很粗暴, 按照编程角度来看就是硬撸, 也怪自己实力有限, 所以反思了一下, 尝试着继续前行...…

将公平注入AI:机器学习模型即使在不公平数据上训练也能产生公平输出

来源&#xff1a;ScienceAI编译&#xff1a;绿萝如果使用不平衡的数据集训练机器学习模型&#xff0c;比如一个包含远多于肤色较浅的人的图像的数据集&#xff0c;则当模型部署在现实世界中时&#xff0c;该模型的预测存在严重风险。但这只是问题的一部分。麻省理工学院的研究人…

使用ngModel创建组件

angular/forms里有个接口用来实现支持[(ngModel)]&#xff0c;具体可查ControlValueAccessor&#xff0c;这边还未深入理解只是为了开发组件而初步了解 interface ControlValueAccessor {writeValue(obj: any): voidregisterOnChange(fn: any): voidregisterOnTouched(fn: any)…

制定城市大脑建设标准应遵循的十条原则探讨

作者&#xff1a;刘锋本文发表于2022年3月《中国建设信息化杂志》2015以来&#xff0c;城市大脑被提出并成为前沿科技和智慧城市建设领域的新热点。到2022年&#xff0c;全国已经有包括北京、上海、杭州、深圳、郑州、呼和浩特、合肥等数百个城市宣布建设城市大脑的规划。有包括…

图灵测试,时至今日还有意义吗?

来源&#xff1a;学术头条我们必须承认&#xff0c;机器运行时的很多中间状态&#xff0c;是在设计初始指令时无法预见的。机器自己也会感悟出很多知识。在这种情況下&#xff0c;我们有必要将机器视为智能的。艾伦图灵图灵测试由人工智能之父—艾伦图灵提出&#xff0c;指测试…

AI科普微视频丨深度学习如何帮助自动驾驶

来源&#xff1a;中国人工智能学会人工智能是如何产生的&#xff1f;人工智能的发展为什么充满曲折&#xff1f;为什么说图灵是人工智能之父&#xff1f;为加大AI科普力度&#xff0c;推动文化传播&#xff0c;中国人工智能学会推出了“AI科普微视频”栏目&#xff0c;以每期2~…

在新的数学证明中,人工智能取胜

来源&#xff1a;ScienceAI编辑&#xff1a;绿萝一个以 AlphaGo 等人工智能系统为原型的新计算机程序解决了组合学和图论中的几个未解决问题。去年 3 月&#xff0c;爱荷华州立大学&#xff08;Iowa State University&#xff09;的数学家 Leslie Hogben 和 Carolyn Reinhart 收…

day44-前端知识之HTML内容

什么是前端?什么是后端? # 任何与用户直接打交道的操作界面都可以称之为前端,前端跟python没有任何关系 比如:电脑界面,手机界面,平板界面# 暂时先理解成 幕后操作者(不直接与用户打交道)为什么要学前端? 因为全栈开发工程师就是同时懂前端和后端 1.信心满满 老子一定能学会…

车路协同让城市更智慧

来源&#xff1a;深城物联在高速发展的现代社会&#xff0c;纷繁复杂的城市道路交织成奔腾不息的交通动脉。今年&#xff0c;全国政协委员、百度董事长兼首席执行官李彦宏在提案中关注“智能交通”“自动驾驶”。在新一代信息技术不断发展的背景下&#xff0c;汽车与城市道路的…

gin-jwt对API进行权限控制

前言 之前文章简单介绍了如何运行ginvue的前后端分离开源项目&#xff0c;该项目是学习了Gin实践教程后结合vue-element-admin写的&#xff0c;该教程讲得很详细&#xff0c;适合入门Gin。本篇文章将介绍ginvue的前后端分离开源项目中如何使用gin-jwt对API进行权限验证。 安装g…

Michael Brostein 最新几何深度学习综述:超越 WL 和原始消息传递的 GNN

来源&#xff1a;前沿科技编译&#xff1a;OGAI编辑&#xff1a;陈彩娴如何突破基于 WL 测试和消息传递机制的 GNN 的性能瓶颈&#xff1f;且看几何深度学习旗手、牛津大学教授 Michael Brostein 如是说。图可以方便地抽象关系和交互的复杂系统。社交网络、高能物理、化学等研究…

day45-前端CSS

1.0 CSS介绍 CSS&#xff08;Cascading Style Sheet&#xff0c;层叠样式表)定义如何显示HTML元素。 当浏览器读到一个样式表&#xff0c;它就会按照这个样式表来对文档进行格式化&#xff08;渲染&#xff09;。 2.0 CSS语法 2.1 CSS实例 每个CSS样式由两个组成部分&#xff1…

人工智能克服了类脑硬件的绊脚石

来源&#xff1a;ScienceAI编辑&#xff1a;萝卜皮当今最成功的人工智能算法——人工神经网络&#xff0c;松散地基于我们大脑中复杂的真实神经网络网络。但与我们高效的大脑不同&#xff0c;在计算机上运行这些算法会消耗巨大的能量&#xff1a;最大的模型在其生命周期中消耗的…