前端angularjs+requirejs+dhtmlx 后端asp.net webapi
标签：
一、前言半年前左右折腾了一个前后端分离的架子，这几天才想起来翻出来分享给大家。关于前后端分离这个话题大家也谈了很久了，希望我这个实践能对大家有点点帮助，演示和源码都贴在后面。
二、技术架构这两年angularjs和reactjs算是比较火的项目了，而我选择angularjs并不是因为它火，而是因它的模块化、双向数据绑定、注入、指令等都是非常适合架构较复杂的前端应用，而且文档是相当的全，碰到问题基本上可以在网上都找到答案。所以前端基本思路就以angularjs为主、代码模块化，通过requirejs实现动态加载，，ui选择dhtmlx为主配合少量bootstrap3使用。前端项目dhtmlx_web：
开发工具 Sublime Text
前端框架angularjs
模块加载requirejs
前端UI dhtmlx + bt3
包管理 bower
构建工具 gruntjs
服务架设 http_server.js
浏览器支持IE8+ 实际是为了支持IE8我做了很多的努力，因为angluarjs 1.3已经不再支持IE8了，而我使用的angularjs是1.3.9
引入的一些其它类库或插件就不列出来了，太多了
服务端主要是提供restful数据服务,所以.net下毫无疑问选择asp.net webapi来实现了。 后端项目dhtmlx_webapi:
开发工具 VS2012
数据服务 Asp.net WebApi
跨域实现 CORS
依赖注入 Autofac
日志组件 Log4net
数据库已改为MS Access (为了方便大家可以直接运行)
1、基本说明
项目主要分了三个文件夹assets存放引用类库及插件，app中则是项目文件，build中存放构建后的文件，先让大家看几个实现的页面，再介绍代码吧
这是查询页面，查询条件、分页、排序都可用
这是虚拟分页的实现，也实现了过滤行，我自己也是挺喜欢这种风格的。
编辑页面
2、程序入口
以上的几个页面都比较典型，如果大家右键查看源码的话只能看到：
<!DOCTYPE html> <html> <head> <title>权限管理系统</title> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <link href="build/app.png" rel="shortcut icon" type="image/x-icon" /> <link href="build/app.css" rel="stylesheet" /> <!--[if lte IE 8]><script src="http://www.mamicode.com/build/ie.js"></script><![endif]--> </head> <body ng-controller="myController"> <div id="my_header" my-header ></div> <div id="my_layout" my-layout ></div> <div id="my_footer" my-footer ></div> <div id="my_setting" my-setting ></div> <div id="my_chat" my-chat ></div> <script src="build/app.js"></script> </body> </html>
温馨提示: 本文由Jm博客推荐，转载请保留链接: https://www.jmwww.net/file/66754.html
- 上一篇：C# 之 日常积累（二）
- 下一篇：没有了
