当我们用ASP.NET MVC开发Web应用程序的时候,我们都是将需要呈现的数据通过"Controllers"传输到"View"当中,怎么去实现,下面我介绍一下我在实际工作当中用到过的几种方式。

创建一个ASP.NET MVC Web Application

在Visual Studio中创建ASP.NET Web Application应用程序,在向导的下一个窗口中选择空的模板。

创建Model

接着我们在Models文件夹下创建一个Product类,用来传递数据。

     public class Product
{
public int ProductID { get; set; }
public string ProductName { get; set; }
public decimal Price { get; set; }
public int Count { get; set; }
public string Description { get; set; }
}

创建Controller

接着在Controllers文件下创建一个Controller, 命名为"ProductController"。

创建View

然后我们在Views -> Product目录下创建一个View,命名为Index

到此,我们创建好了ModelViewController,在开始运行之前,我们需要更改一下默认路由配置。打开App_Start目录下的RouteConfig.cs文件,并更改默认路由如下:

     public class RouteConfig
{
public static void RegisterRoutes(RouteCollection routes)
{
routes.IgnoreRoute("{resource}.axd/{*pathInfo}"); routes.MapRoute(
name: "Default",
url: "{controller}/{action}/{id}",
defaults: new { controller = "Product", action = "Index", id = UrlParameter.Optional }
);
}
}

好了,下面我们就正式开始实现数据从"Controller"到"View"的实现。

1. 使用ViewData。

ViewData是一个字典,它存放的是键值对。

打开新建好的ProductController.cs,使用using引入Product类所在的命名空间,在IndexAction里创建一个Product对象并且赋值给一个ViewData

using TransDataToView.Models;
         public ActionResult Index()
{
Product product = new Product
{
ProductID = ,
ProductName = "BMW X5",
Price = ,
Count = ,
Description = "BMW SUV"
}; ViewData["Product"] = product; return View();
}

接着,我们打开新建好的Index View文件,对Controller里的ViewData数据进行接收处理。

 @using TransDataToView.Models
@{
Layout = null;
} <!DOCTYPE html> <html>
<head>
<meta name="viewport" content="width=device-width" />
<title>Index</title>
</head>
<body>
<div>
@{
var product = (Product)ViewData["Product"];
}
<h2>
Product ID: @product.ProductID <br />
Product Name: @product.ProductName <br />
Price: @product.Price <br />
Count: @product.Count <br />
Description: @product.Description
</h2>
</div>
</body>
</html>

因为我们需要将ViewData数据转换成需要的Product对象数据,所以这里要引入Produdct类所在的命名空间,使用@符号,也就是Razor语法来引入,定义,赋值等操作。

2. 使用ViewBag。

ViewBag它跟ViewData一样,都是字典值,但它存放的不是键值对,而是dynamic动态类型,这是ASP.NET MVC3新增的部分。

同样我们在Index Action里将Proudct对象赋值给一个ViewBag

        public ActionResult Index()
{
Product product = new Product
{
ProductID = ,
ProductName = "BMW X5",
Price = ,
Count = ,
Description = "BMW SUV"
}; ViewBag.Product = product; return View();
}

同样,我们打开Index View文件,对Controller里的ViewBag数据进行接收处理。

 @{
Layout = null;
} <!DOCTYPE html> <html>
<head>
<meta name="viewport" content="width=device-width" />
<title>Index</title>
</head>
<body>
<div>
<h3>
Product ID: @ViewBag.Product.ProductID <br />
Product Name: @ViewBag.Product.ProductName <br />
Price: @ViewBag.Product.Price <br />
Count: @ViewBag.Product.Count <br />
Description: @ViewBag.Product.Description
</h3>
</div>
</body>
</html>

可以看到ViewBag不需要转型直接就可以使用里面的数据了。

3. 使用TempData。

TempData也是字典,它的使用完全等同于ViewData,两者之间最大的差异是TempData对数据的保存是临时性的。也就是它请求后,数据就被清除,也就是只能通过一次Controller传递。通常用于Action之间的一次性传递,所以它一般不直接用于传递到View中。

我们增加一个名为"TempDataIndex"的Action

Controller:

         public ActionResult Index()
{
ViewData["Message"] = "This is a View Data Message."; if (TempData["Message"] != null)
ViewData["Message"] = TempData["Message"]; return View();
} public ActionResult TempDataIndex()
{
TempData["Message"] = "This is a Temp Data Message."; return RedirectToAction("Index");
}

View:

     <div>
<h3>
@ViewData["Message"]
</h3>
</div>

我们运行程序。结果如下:

此时TempData数据为null,我们导航到/Product/TempDataIndex下,结果如下:

我们看到通过TempDataIndex的Action里,TempData["Message"]有了数据,然后转向了Index的Action方法里,所以TempData的值赋给了ViewData。这是我们刷新一下页面,结果如下:

4. 使用View(object)。

通过直接传递object数据到View中。

         public ActionResult Index()
{
Product product = new Product
{
ProductID = ,
ProductName = "BMW X5",
Price = ,
Count = ,
Description = "BMW SUV"
}; return View(product);
}

那么在View文件中需要绑定Controller里传递的对象。

 @using TransDataToView.Models
@model TransDataToView.Models.Product
@{
Layout = null;
} <!DOCTYPE html> <html>
<head>
<meta name="viewport" content="width=device-width" />
<title>Index</title>
</head>
<body>
<div>
<h2>
Product ID: @Model.ProductID <br />
Product Name: @Model.ProductName <br />
Price: @Model.Price <br />
Count: @Model.Count <br />
Description: @Model.Description
</h2>
</div>
</body>
</html>

@model TransDataToView.Models.Product 意思就是绑定的是Product对象的Model,然后使用@Model.字段属性名来取值。

好了,本篇就先到此,希望对你有所帮助,谢谢!

总结ASP.NET MVC Web Application中将数据显示到View中的几种方式的更多相关文章

  1. 总结ASP.NET MVC视图页使用jQuery传递异步数据的几种方式

    在ASP.NET MVC的视图页向控制器传递异步数据,可能是数组,JavaScript对象,json,表单数据,等等. 关于数据,JavaScript对象有时候和json长得一模一样,有么有? var ...

  2. MVC教程四:Controller向View传值的几种方式

    一.通过ViewData传值 MVC从开始版本就一直支持使用ViewData将Controller里面的数据传递到View.ViewData定义如下: 从上面的截图中可以看出,ViewData里面存的 ...

  3. [译]ABP框架使用AngularJs,ASP.NET MVC,Web API和EntityFramework构建N层架构的SPA应用程序

    本文转自:http://www.skcode.cn/archives/281 本文演示ABP框架如何使用AngularJs,ASP.NET MVC,Web API 和EntityFramework构建 ...

  4. ASP.NET MVC Web API Post FromBody(Web API 如何正确 Post)

    问题场景: ASP.NET MVC Web API 定义 Post 方法,HttpClient 使用 JsonConvert.SerializeObject 传参进行调用,比如 Web Api 中定义 ...

  5. ASP.NET MVC Web API 学习笔记---第一个Web API程序

    http://www.cnblogs.com/qingyuan/archive/2012/10/12/2720824.html GetListAll /api/Contact GetListBySex ...

  6. 实战 ASP.NET MVC Web API

    实战 ASP.NET MVC Web API Web API 框架基于 ASP.NET MVC 框架开发,是一个面向 Http 协议的通信框架.相对于 WCF 而言,Web API 只面向于 Http ...

  7. ABP 教程文档 1-1 手把手引进门之 AngularJs, ASP.NET MVC, Web API 和 EntityFramework(官方教程翻译版 版本3.2.5)含学习资料

    本文是ABP官方文档翻译版,翻译基于 3.2.5 版本 转载请注明出处:http://www.cnblogs.com/yabu007/  谢谢 官方文档分四部分 一. 教程文档 二.ABP 框架 三. ...

  8. [转]ASP.NET MVC 3 Application Upgrader

    本文转自:http://aspnet.codeplex.com/releases/view/59008 Recommended Download      ASP.NET MVC 3 Applicat ...

  9. ASP.NET MVC Web API For APP

    近来很多大型的平台都公开了Web API.比如百度地图 Web API,做过地图相关的人都熟悉.公开服务这种方式可以使它易于与各种各样的设备和客户端平台集成功能,以及通过在浏览器中使用 JavaScr ...

随机推荐

  1. IOS开发-UI学习-UIPageControl(页码控制器)的使用

    UIPageControl即页码控制器,是在翻动图片阅览时下面显示的几个小点,属性设置如下: UIPageControl *pagecontrol = [[UIPageControl alloc]in ...

  2. JavaScript(一)---- 概述

    JavaScript一种直译式脚本语言,是一种动态类型.弱类型.基于原型的语言,内置支持类型.它的解释器被称为JavaScript引擎,为浏览器的一部分,广泛用于客户端的脚本语言,最早是在HTML(标 ...

  3. 远程开户系统开放API接口

    如今随着智能识别技术的成熟和商用,金融领域也开始逐渐试水"远程开户".从OCR身份证识别到人脸识别,到如今市场上即将出现完整的远程开户系统,除了需要成熟的技术做支撑外,还需要对市场 ...

  4. MongoDB的$type操作符

    字段类型定义: db.col.find({"title" : {$type : 2}})

  5. UVa 10684 - The jackpot

    题目大意:给一个序列,求最大连续和. 用sum[i]表示前i个元素之和,那么以第i个元素结尾的最大连续和就是sum[i]-sum[j] (j<i)的最大值,也就是找前i-1个位置sum[]的最小 ...

  6. pypi 的使用

    关于本人的package,情况比较简单,所有的.py文件全部放到了一个叫做FundsData的文件夹下(package下),上层目录也叫FundsData(其实叫什么都可以),其下放了setup.py ...

  7. IM 融云 之 列表及封装

    // // ChatListIMViewController.m // testRongCloudIM // // Created by WoodGao on 16/1/8. // Copyright ...

  8. Android中关闭应用的三种方式

    当应用不再使用的时候,通常需要关闭应用,我们可以使用三种方式关闭android应用: 第一种方式:首先获取当前进程的id,然后杀死该进程(推荐) android.os.Process.killProc ...

  9. PHP 递归实现层级树状展现数据

    <?php $db = mysql_connect('localhost', 'root', 'root') or die('Can\'t connect to database'); mysq ...

  10. java_web学习(2)Servlet

    软件编程体系 B\S 系统架构与C\S 系统结构 Web服务器         HTTP 协议:Web 浏览器与 web 服务器的交互所遵循的规则.         Web 服务器:Web服务器可以解 ...