你的位置:首页 > ASP.net教程

[ASP.net教程]如何在ASP.NET MVC和EF中使用AngularJS


(此文章同时发表在本人微信公众号“dotNET每日精华文章”,欢迎右边二维码来关注。)

AngularJS作为一个越来越流行的前端框架,在使用ASP.NET MVC和实体框架开发Web应用的时候,恰当的使用它可以让你的前端界面更易开发。今天推荐的文章就是介绍如何把AngularJS结合到ASP.NET MVC开发当中。

虽然之前开发的一套SaaS系统也是以ASP.NET MVC、实体框架为基础,前端辅以AngularJS。不过一直无暇很好总结一下这方面的经验分享给大家,刚好今天推荐的文章就是讲述如何把AngularJS结合到ASP.NET的Web应用开发当中。其实步骤很简单:

  1. 通过Nuget把AngularJS添加到ASP.NET MVC的Web项目中(我一般使用作者为The AngularJS Team的包)
  2. 在视图或者布局文件中引用AngularJS的js文件,也可以添加到bundles
  3. 通过Entity Framework来获取数据
  4. 在ASP.NET MVC/WEB API的Controller中返回JSON数据
  5. 在AngularJS服务中消费这些服务端返回的JSON数据
  6. 在AngularJS控制器中调用AngularJS服务把数据传递给视图
  7. 在AngularJS视图中呈现数据

Dhananjay Kumar的这篇文章基本就是按照这个步骤的一个完整入门练习,通过“阅读原文”来仔细阅读其中的文字、配图和代码,要入门不是难事。

当然在实际实践当中还是有一些技巧的,也需要自己探寻一种符合自己情况的做法。比如我们之前并未基于AngularJS把整个Web应用做成单页应用(Single Page Application,SPA),而只是在一些需要高度交互性的页面上,利用AngularJS的绑定、MVC模型对前端代码进行优化。具体而言,ng-app一般是基于一个ASP.NET MVC视图的,且这些视图还是充分利用ASP.NET MVC本身的特性(比如由Layout来统一布局,利用PartialView组合界面等)。以后有空再详细分析我们的经验。

原文地址:http://www.infragistics.com/community/blogs/dhananjay_kumar/archive/2015/05/13/how-to-use-angularjs-in-asp-net-mvc-and-entity-framework-4.aspx