ASP.NET MVC框架下使用MVVM模式
2011-07-21 16:38
435 查看
对于asp.net mvc开发人员或爱好者来说,MVVM模式可能你不是很了解。本来这个模式就是针对WPF和Silverlight开发提出的开发模式。
大概一年前,我当时迷恋Silverlight时,学习了MVVM一段时间,没想到现在可以在MVC用到。
我看了下之前有两篇文章介绍MVVM的。希望可以对MVVM不了解的人有点帮助。我也是好久没用了,生疏了都。
/article/4830917.html
/article/4830916.html
上个月底就准备写这篇mvc框架下的mvvm应用,,不过最近有点忙碌加上纠结,所以延后了这么长时间。
主要实现mvvm模式的最近很强大的knockoutjs,官方网站:
![](http://images.cnblogs.com/cnblogs_com/n-pei/201107/201107211637456739.png)
作者在mix11上做过这个框架的使用分享,视频地址:http://channel9.msdn.com/Events/MIX/MIX11/FRM08
为什么要用mvvm模式呢,为了让大家不再需要不停地事件捕获,而是使用面向对象的javascript和数据绑定来实现。knockoutjs还兼容各种浏览器。
![](http://images.cnblogs.com/cnblogs_com/n-pei/201107/201107211637526569.png)
knockoutjs的实现原理如下图:
![](http://images.cnblogs.com/cnblogs_com/n-pei/201107/20110721163757991.png)
每个页面都会有一个viewmodel,它是连接服务器端和客户端的纽带。数据都会保存在viewmodel中,然后通过数据绑定来把数据显示到html。这个非常适合异步的数据传输系统。因为asp.net mvc 对ajax的支持更加好。
![](http://images.cnblogs.com/cnblogs_com/n-pei/201107/201107211638053579.png)
上图中说明了如何使用knockoutjs。首先页面中需要有一个viewMode来存放所有的数据和交互数据的函数。如果要knockoutjs生效你需要使用上图中的最后一行代码。
knockoutjs和jquery集成的非常好,你可以结合jquery的template来实现复杂业务的数据显示。上图中的html元素有data-bind属性,说明是使用了ko的数据绑定,也就是MVVM模式。
在asp.net mvc中上图中的数据源可以设置为AJAX方式。Action把Json格式的数据传输到viewmodel中,然后使用kojs来把数据绑定到页面。不错的一个方案。
接下来我会放上一些完整的例子来。 待续…
大概一年前,我当时迷恋Silverlight时,学习了MVVM一段时间,没想到现在可以在MVC用到。
我看了下之前有两篇文章介绍MVVM的。希望可以对MVVM不了解的人有点帮助。我也是好久没用了,生疏了都。
/article/4830917.html
/article/4830916.html
上个月底就准备写这篇mvc框架下的mvvm应用,,不过最近有点忙碌加上纠结,所以延后了这么长时间。
主要实现mvvm模式的最近很强大的knockoutjs,官方网站:
![](http://images.cnblogs.com/cnblogs_com/n-pei/201107/201107211637456739.png)
作者在mix11上做过这个框架的使用分享,视频地址:http://channel9.msdn.com/Events/MIX/MIX11/FRM08
为什么要用mvvm模式呢,为了让大家不再需要不停地事件捕获,而是使用面向对象的javascript和数据绑定来实现。knockoutjs还兼容各种浏览器。
![](http://images.cnblogs.com/cnblogs_com/n-pei/201107/201107211637526569.png)
knockoutjs的实现原理如下图:
![](http://images.cnblogs.com/cnblogs_com/n-pei/201107/20110721163757991.png)
每个页面都会有一个viewmodel,它是连接服务器端和客户端的纽带。数据都会保存在viewmodel中,然后通过数据绑定来把数据显示到html。这个非常适合异步的数据传输系统。因为asp.net mvc 对ajax的支持更加好。
![](http://images.cnblogs.com/cnblogs_com/n-pei/201107/201107211638053579.png)
上图中说明了如何使用knockoutjs。首先页面中需要有一个viewMode来存放所有的数据和交互数据的函数。如果要knockoutjs生效你需要使用上图中的最后一行代码。
knockoutjs和jquery集成的非常好,你可以结合jquery的template来实现复杂业务的数据显示。上图中的html元素有data-bind属性,说明是使用了ko的数据绑定,也就是MVVM模式。
在asp.net mvc中上图中的数据源可以设置为AJAX方式。Action把Json格式的数据传输到viewmodel中,然后使用kojs来把数据绑定到页面。不错的一个方案。
接下来我会放上一些完整的例子来。 待续…
相关文章推荐
- 【转】ASP.NET MVC框架下使用MVVM模式-KnockOutJS+JQ模板例子
- ASP.NET MVC框架下使用MVVM模式 knockoutjs的实现原理
- ASP.NET MVC框架下使用MVVM模式
- 【工作笔记二】ASP.NET MVC框架下使用MVVM模式
- ASP.NET MVC - 使用Post, Redirect, Get (PRG)模式
- 依赖注入框架Autofac的简单使用,以及在 ASP.NET MVC 中的使用
- 《Entity Framework 6 Recipes》中文翻译系列 (21) -----第四章 ASP.NET MVC中使用实体框架之在页面中创建查询和使用ASP.NET URL路由过虑
- asp.net mvc框架里使用的FCKEditor控件上传内容报错
- 使用实体框架和 ASP.NET MVC 3 进行服务器端分
- [译]ABP框架使用AngularJs,ASP.NET MVC,Web API和EntityFramework构建N层架构的SPA应用程序
- 使用Northwind和Entity框架的ASP.NET MVC实例发布
- 支持ASP.NET MVC、WebFroM的表单验证框架ValidationSuar使用介绍
- ASP.NET MVC 4 (十一) Bundles和显示模式--asp.net mvc中 @Scripts.Render("~/bundles/jquery")是什么意思? 在布局文件中使用Scripts.Render()输出脚本包,Styles.Render()输出风格包:
- StructureMap 作为 ASP.NET MVC 的 DI 框架的使用实例
- 扩展ASP.NET MVC三层框架并使用StructureMap实现依赖注入1
- 使用Northwind和Entity框架的ASP.NET MVC实例
- 使用ASP.NET MVC框架创建电子商务网站
- 扩展ASP.NET MVC三层框架并使用StructureMap实现依赖注入2
- asp.net mvc新建运行Debug时,提示 此操作要求使用 IIS 集成管线模式
- asp.net mvc Autofac 依赖注入框架 使用