zoukankan      html  css  js  c++  java

  • ASP.NET MVC中Controller向View传值的几种方式

    一、准备工作

    创建一个ASP.NET MVC程序，然后在Models文件夹里面新添加Student实体类，用来模拟从Controller向View传递数据，Student类定义如下：

     1 using System;
 2 using System.Collections.Generic;
 3 using System.Linq;
 4 using System.Web;
 5 
 6 namespace MVCStudyDemo.Models
 7 {
 8     public class Student
 9     {
10         public int ID { get; set; }
11 
12         public string Name { get; set; }
13 
14         public int Age { get; set; }
15 
16         public string Sex { get; set; }
17 
18         public string Email { get; set; }
19     }
20 }

    二、通过ViewData传值

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

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

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

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

    Controller代码如下：

     1 using MVCStudyDemo.Models;
 2 using System;
 3 using System.Collections.Generic;
 4 using System.Linq;
 5 using System.Web;
 6 using System.Web.Mvc;
 7 
 8 namespace MVCStudyDemo.Controllers
 9 {
10     public class ViewDataDemoController : Controller
11     {
12         // GET: ViewDataDemo
13         /// <summary>
14         /// 通过ViewData向对应的View传递数据
15         /// </summary>
16         /// <returns></returns>
17         public ActionResult Index()
18         {
19             // 1、将字符串传递到View
20             ViewData["Other"] = "通过ViewData向View传递字符串";
21             // 2、通过KeyValuePair添加
22             ViewData.Add(new KeyValuePair<string, object>("name","tom"));
23             // 3、直接添加
24             ViewData.Add("age", 23);
25             // 4、传递集合到View
26             ViewData["Data"] = new List<Student>()
27             {
28                 new Student
29                {
30                  ID = 1,
31                  Name = "唐僧",
32                  Age = 34,
33                  Sex = "男",
34                  Email = "747976523@qq.com"
35                },
36                new Student
37                {
38                  ID = 2,
39                  Name = "孙悟空",
40                  Age = 635,
41                  Sex = "男",
42                  Email = "sunwukong@163.com"
43                },
44                new Student
45                {
46                  ID = 3,
47                  Name = "白骨精",
48                  Age = 4532,
49                  Sex = "女",
50                  Email = "74345523@qq.com"
51                }
52             };
53 
54             // 返回同名的视图
55             return View();
56         }
57     }
58 }

     对应的View视图代码如下：

     1 @*引入Student的命名空间*@
 2 @using MVCStudyDemo.Models;
 3 @{
 4     ViewBag.Title = "Index";
 5     // 这里使用的是Razor语法，写的是后台C#代码
 6     // ViewData的Value值是Object类型的，需要进行类型转换
 7     // 常规写法是先在这里进行类型转换
 8     var list = ViewData["Data"] as List<Student>;
 9 }
10 
11 <h2>通过ViewData向View传递数据</h2>
12 <div class="jumbotron">
13         <div>
14             <div>
15                 1、传递字符串 other:@ViewData["Other"];
16             </div>
17             <div>
18                 2、传递字符串 name:@ViewData["name"];
19             </div>
20             <div>
21                 3、传递字符串 age:@ViewData["age"];
22             </div>
23             <div>
24                 4、传递集合方式一
25                 @foreach (var item in list)
26                 {
27                     <div>
28                         ID:@item.ID  Name:@item.Name  Age:@item.Age  Sex:@item.Sex  Email:@item.Email
29                     </div>
30                 }
31             </div>
32             <div>
33                 5、传递集合方式二
34                 @foreach (var item in ViewData["Data"] as List<Student>)
35                 {
36                     <div>
37                         ID:@item.ID  Name:@item.Name  Age:@item.Age  Sex:@item.Sex  Email:@item.Email
38                     </div>
39                 }
40             </div>
41         </div>
42 </div>

     运行结果：

    三、通过ViewBag传值

    ViewBag是在MVC3中出现的，ViewBag是动态（dynamic）类型的。

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

    Controller代码：

     1 using MVCStudyDemo.Models;
 2 using System;
 3 using System.Collections.Generic;
 4 using System.Linq;
 5 using System.Web;
 6 using System.Web.Mvc;
 7 
 8 namespace MVCStudyDemo.Controllers
 9 {
10     public class ViewBagDemoController : Controller
11     {
12         // GET: ViewBagDemo
13         /// <summary>
14         /// 通过ViewBag向View传递数据
15         /// </summary>
16         /// <returns></returns>
17         public ActionResult Index()
18         {
19             // 通过ViewData传值
20             ViewData["name"] = "ViewData";
21             // 传递集合到View
22             ViewData["Data"] = new List<Student>()
23             {
24                 new Student
25                {
26                  ID = 1,
27                  Name = "唐僧",
28                  Age = 34,
29                  Sex = "男",
30                  Email = "747976523@qq.com"
31                },
32                new Student
33                {
34                  ID = 2,
35                  Name = "孙悟空",
36                  Age = 635,
37                  Sex = "男",
38                  Email = "sunwukong@163.com"
39                },
40                new Student
41                {
42                  ID = 3,
43                  Name = "白骨精",
44                  Age = 4532,
45                  Sex = "女",
46                  Email = "74345523@qq.com"
47                }
48             };
49 
50             // 通过ViewBag传值
51             ViewBag.Name = "ViewBag";
52             ViewBag.StudentData = new Student()
53             {
54                 ID = 5,
55                 Name = "沙悟净",
56                 Age = 567,
57                 Sex = "男",
58                 Email = "4567890345@qq.com"
59             };
60             // 返回同名视图
61             return View();
62         }
63     }
64 }

    对应的Index视图代码：

     1 @*引入Student的命名空间*@
 2 @using MVCStudyDemo.Models;
 3 @{
 4     ViewBag.Title = "Index";
 5     // ViewBag是dynamic类型的，使用的时候不需要进行类型转换
 6     var stu = ViewBag.StudentData;
 7     var stuList = ViewBag.Data;
 8 }
 9 
10 <h2>通过ViewBag向View传递数据</h2>
11 <div class="jumbotron">
12     <div>
13         <div>
14             Controller通过ViewBag向View传递数据
15         </div>
16         <div>
17             1、通过ViewData传递字符串 ViewData["name"]:@ViewData["name"];
18         </div>
19         <div>
20             2、通过ViewBag传递字符串 ViewBag.name:@ViewBag.Name;
21         </div>
22         <div>
23             3、输出stu
24             <div>
25                 ID:@stu.ID  Name:@stu.Name  Age:@stu.Age  Sex:@stu.Sex  Email:@stu.Email
26             </div>
27             4、输出stuList
28             @foreach (var item in stuList)
29             {
30                 <div>
31                     ID:@item.ID  Name:@item.Name  Age:@item.Age  Sex:@item.Sex  Email:@item.Email
32                 </div>
33             }
34         </div>
35     </div>
36 </div>

    运行结果；

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

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

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

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

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

    修改Controller代码，将ViewData的顺序放到ViewBag后面：

     1 using MVCStudyDemo.Models;
 2 using System;
 3 using System.Collections.Generic;
 4 using System.Linq;
 5 using System.Web;
 6 using System.Web.Mvc;
 7 
 8 namespace MVCStudyDemo.Controllers
 9 {
10     public class ViewBagDemoController : Controller
11     {
12         // GET: ViewBagDemo
13         /// <summary>
14         /// 通过ViewBag向View传递数据
15         /// </summary>
16         /// <returns></returns>
17         public ActionResult Index()
18         {
19             // 通过ViewData传值
20             //ViewData["name"] = "ViewData";
21             // 传递集合到View
22             ViewData["Data"] = new List<Student>()
23             {
24                 new Student
25                {
26                  ID = 1,
27                  Name = "唐僧",
28                  Age = 34,
29                  Sex = "男",
30                  Email = "747976523@qq.com"
31                },
32                new Student
33                {
34                  ID = 2,
35                  Name = "孙悟空",
36                  Age = 635,
37                  Sex = "男",
38                  Email = "sunwukong@163.com"
39                },
40                new Student
41                {
42                  ID = 3,
43                  Name = "白骨精",
44                  Age = 4532,
45                  Sex = "女",
46                  Email = "74345523@qq.com"
47                }
48             };
49 
50             // 通过ViewBag传值
51             ViewBag.Name = "ViewBag";
52             ViewBag.StudentData = new Student()
53             {
54                 ID = 5,
55                 Name = "沙悟净",
56                 Age = 567,
57                 Sex = "男",
58                 Email = "4567890345@qq.com"
59             };
60             // 把ViewData的顺序放到ViewBag后面
61             ViewData["name"] = "ViewData";
62             // 返回同名视图
63             return View();
64         }
65     }
66 }

     在查看Index视图显示效果：

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

    四、通过TempData传值

    查看TempData的定义：

     我们发现TempData也是字典类型的。

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

    Controller代码：

     1 using MVCStudyDemo.Models;
 2 using System;
 3 using System.Collections.Generic;
 4 using System.Linq;
 5 using System.Web;
 6 using System.Web.Mvc;
 7 
 8 namespace MVCStudyDemo.Controllers
 9 {
10     public class TempDataDemoController : Controller
11     {
12         // GET: TempDataDemo
13         public ActionResult Index()
14         {
15             // ViewData
16             ViewData["Name"] = "tom";
17             // ViewBage
18             ViewBag.Name = "Jon";
19             // TempData
20             TempData["Name"] = "Andi";
21             TempData["Stu"] = new Student()
22             {
23                 ID = 5,
24                 Name = "沙悟净",
25                 Age = 567,
26                 Sex = "男",
27                 Email = "4567890345@qq.com"
28             };
29 
30             // 返回同名视图
31             return View();
32         }
33     }
34 }

    对应的Index视图代码，TempData也是字典类型的，所以在View页面中使用的时候也需要进行类型转换：

     1 @*引入Student的命名空间*@
 2 @using MVCStudyDemo.Models;
 3 @{
 4     ViewBag.Title = "Index";
 5 }
 6 @{
 7     // 类型转换
 8     var stu = TempData["Stu"] as Student;
 9 }
10 
11 <h2>通过TempData向View传递数据</h2>
12 <div class="jumbotron">
13     <p>
14         <div>
15             <div>
16                 通过ViewData传递字符串 ViewData["Name"]:@ViewData["Name"];
17             </div>
18         </div>
19     </p>
20 
21     <p>
22         <div>
23             <div>
24                 通过ViewBag传递字符串 ViewBag.Name:@ViewBag.Name;
25             </div>
26         </div>
27     </p>
28     <p>
29         <div>
30             <div>
31                 1、传递字符串 TempData["Name"]:@TempData["Name"];
32             </div>
33             2、输出stu
34             <div>
35                 ID:@stu.ID  Name:@stu.Name  Age:@stu.Age  Sex:@stu.Sex  Email:@stu.Email
36             </div>
37         </div>
38     </p>
39 </div>

     运行结果：

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

     1 using MVCStudyDemo.Models;
 2 using System;
 3 using System.Collections.Generic;
 4 using System.Linq;
 5 using System.Web;
 6 using System.Web.Mvc;
 7 
 8 namespace MVCStudyDemo.Controllers
 9 {
10     public class TempDataDemoController : Controller
11     {
12         // GET: TempDataDemo
13         public ActionResult Index(int? id)
14         {
15             // ViewData
16             ViewData["Name"] = "tom";
17             // ViewBage
18             ViewBag.Name = "Jon";
19             // TempData
20             TempData["Name"] = "Andi";
21             TempData["Stu"] = new Student()
22             {
23                 ID = 5,
24                 Name = "沙悟净",
25                 Age = 567,
26                 Sex = "男",
27                 Email = "4567890345@qq.com"
28             };
29 
30             if(id==null)
31             {
32                 // 跳转到TempDataTest方法
33                 return RedirectToAction("TempDataTest");
34             }
35             else
36             {
37                 // 返回同名视图
38                 return View();
39             }          
40         }
41 
42         public ActionResult TempDataTest()
43         {
44             // 返回同名视图
45             return View();
46         }
47     }
48 }

     TempDataTest视图代码：

     1 @*引入Student的命名空间*@
 2 @using MVCStudyDemo.Models;
 3 @{
 4     ViewBag.Title = "TempDataTest";
 5     // 类型转换
 6     var stu = TempData["Stu"] as Student;
 7 }
 8 
 9 <h2>TempDataTest</h2>
10 <h3>ViewData["Name"]:@ViewData["Name"]</h3>
11 <h3>ViewBage.Name:@ViewBag.Name</h3>
12 <h3>TempData["Name"]:@TempData["Name"];</h3>
13 <h3>ID:@stu.ID  Name:@stu.Name  Age:@stu.Age  Sex:@stu.Sex  Email:@stu.Email</h3>

    我们先在浏览器里面输入下面的地址：http://localhost:1098/TempDataDemo/index/12 ，这里给id传值12，根据代码，会显示Index视图：

    我们看到：ViewData、ViewBag和TempData都可以取到值。 

    在浏览器里面输入下面的URL地址：http://localhost:9080/TempDataDemo/index，这就表示传递的id是null值，根据代码，会返回TempDataTest视图，运行结果：

    从结果会发现这时ViewData和ViewBag都取不到数据了，只有TempData可以取到数据，可以得出TempData和ViewData、ViewBag的区别：

    1. ViewData和ViewBag不能跨Action方法使用，TempData可以跨Action方法使用，因为TempData是基于session存储的。
    2. TempData只能跨Action方法访问一次，再次访问数据也会丢失。

    五、Model传值

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

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

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

    对应的controller代码：

     1 using MVCStudyDemo.Models;
 2 using System;
 3 using System.Collections.Generic;
 4 using System.Linq;
 5 using System.Web;
 6 using System.Web.Mvc;
 7 
 8 namespace MVCStudyDemo.Controllers
 9 {
10     public class ModelDemoController : Controller
11     {
12         // GET: ModelDemo
13         public ActionResult Index()
14         {
15             Student student = new Student()
16             {
17                 ID = 5,
18                 Name = "沙悟净",
19                 Age = 567,
20                 Sex = "男",
21                 Email = "4567890345@qq.com"
22             };
23             // 返回model
24             return View(student);
25             // 或者直接返回
26             //return View(new Student()
27             //{
28             //    ID = 5,
29             //    Name = "沙悟净",
30             //    Age = 567,
31             //    Sex = "男",
32             //    Email = "4567890345@qq.com"
33             //});
34         }
35     }
36 }

     Index视图代码：

     1 @{
 2     ViewBag.Title = "Index";
 3 }
 4 @*不需要进行类型转换*@
 5 <h2>通过Model向View传值</h2>
 6 <h3>ID:@Model.ID</h3>
 7 <h3>Name:@Model.Name</h3>
 8 <h3>Age:@Model.Age</h3>
 9 <h3>Sex:@Model.Sex</h3>
10 <h3>Email:@Model.Email</h3>

    运行结果：

    六、总结

    最后总结一下ViewData和ViewBag的区别：
  • 相关阅读:
    学习Python的一些Tips
    读书笔记《深入理解计算机系统》(第三版) 第二章 信息的表示
    读书笔记《深入理解计算机系统》(第三版) 第一章 计算机系统漫游
    C 标准库系列之locale.h
    C 标准库系列之limits.h
    C 标准库系列之float.h
    C 标准库系列之errno.h
    C 标准库系列之ctype.h
    C 标准库系列之assert.h
    C 标准库系列之概述
  • 原文地址：https://www.cnblogs.com/lgx5/p/13890188.html
Copyright © 2011-2022 走看看