描述
- 在angular2刚才发布的不久,不少人不懂得怎么应用,直到如今也不少人不懂怎么用,
因而我在余业时间作了这么一个后台管理系统页面,但愿对你们有帮助!!css
- 从我我的的感受来讲,angular2语法很舒服,上手起来也比较快(多是由于我有java方面的经验吧),但同jquery、react这些的思想有所不一样,初学者仍是要先去了解他们的语法与思想!!

开源地址
https://github.com/myopenreso...html
主要的第三方引用
一个基于angular4.2.4+ng-bootstrap1.0.0-beta.4+bootstrap4.0.0-beta+scss的后台管理系统界面java
更新状况
- 搭建环境,分别加入ng-bootstrap1.0.0-alpha.2五、bootstrap4.1.三、font-awesome4.7.0、animate.css3.5.2等,cc版本为0.0.1
1.1 https://ng-bootstrap.github.i...
1.2 https://v4-alpha.getbootstrap...
1.3 http://fontawesome.io/
1.4 https://github.com/daneden/an...
- 登陆界面
2.1 src/login/login.component.ts
- 主页界面
3.1 src/main/main.component.ts
- 添加alert与confirm组件
4.1 src/app/shared/modal/modal.service.ts
- 添加toast组件
5.1 src/app/shared/toast/toast.service.ts
- 添加第三方ng-charts组件
6.1 https://github.com/swimlane/n...
- 添加第三方angular-2-dropdown-multiselect组件与angular2-select组件
7.1 https://github.com/softsimon/...
7.2 https://github.com/basvandenb...
- 添加层次图组件
8.1 src/app/shared/hierarchy-view/hierarchy-view.component.ts
- 添加第三方ng2-img-cropper组件
9.1 https://github.com/search?q=n...
- 添加头像更换功能
10.1 src/main/avatar-cropper.component.ts
- 添加http服务
11.1 src/app/core/http.service.ts
- 添加utils工具
12.1 src/app/core/utils.ts
- 添加pagination组件
13.1 src/app/shared/pagination/pagination.component.ts
- 添加http-pagination组件
14.1 src/app/shared/pagination/http-pagination.component.ts
- 添加spin组件
15.1 src/app/shared/spin/spin.component.ts
- 添加第三方angular2-ui-switch组件
16.1 https://github.com/yuyang0410...
- 添加时间轴样式
17.1 assets/scss/base/_common.scss
- 添加日期选择datepickerI18n配置
18.1 src/app/shared/datepickerI18n/datepickerI18n.ts
- 添加img-cropper-select指令
19.1 src/app/shared/img-cropper-select/img-cropper-select.directive.ts
- 添加tree组件
20.1 src/app/shared/tree/tree.component.ts
- 添加select-tree组件
21.1 src/app/shared/tree/select-tree.component.ts
- 添加jquery
- 添加ztree组件
23.1 src/app/shared/ztree/ztree.component.ts
- 添加select-ztree组件
24.1 src/app/shared/ztree/select-ztree.component.ts
- 添加img-select-to-base指令
25.1 src/app/shared/img-select/img-select-to-base.directive.ts
- 添加switch组件
26.1 src/app/shared/switch/switche.component.ts
- 移除第三方angular2-ui-switch组件
- 升级版本为0.0.2
- 添加第三方ng2-file-upload组件
29.1 http://valor-software.com/ng2...
- 添加路由预加载策略,解决懒加载时首次使用卡顿问题
30.1 可参考博客http://blog.csdn.net/rotating...
- 添加custom-scrollbar.directive指令
31.1 配置参考:http://manos.malihu.gr/jquery...
- 添加image-viewer.directive指令
32.1 配置参考:https://github.com/fengyuanch...
32.2 配置参考:http://www.cnblogs.com/yi0921...
- 添加spin.component组件
33.1 src/app/shared/spin/spin.component.ts与src/app/shared/spin/spin.service.ts
- 添加部署Tomcat的方法
34.1 参考下面的部署到Tomcat
章节说明
- 解决构建时使用--prod参数的报错问题,使用--prod --aot可提高性能,升级cc版本为0.0.3
- 升级angular版本,使用yarn进行包版本管理,升级cc版本为0.0.4
- 升级ng-bootstrap1.0.0-beta.4与bootstrap4.0.0-beta+scss版本,升级cc版本为0.0.5
- 添加ng2-date-picker组件
38.1 配置参考:https://github.com/vlio20/ang...
- 添加localStorage.service与sessionStorage.service服务
39.1 src/app/shared/storage/localStorage.service.ts
39.2 src/app/shared/storage/sessionStorage.service.ts
- 添加page-browser.component组件
40.1 src/app/shared/page-browser/page-browser.component.ts
- 添加editor.component组件
41.1 src/app/shared/editor/editor.component.ts
41.2 配置参考:https://quilljs.com/docs/modu...
- 将shared目录中的共享模块按具体模块拆分,升级cc版本为0.0.6
- 添加第三方ag-grid组件
43.1 配置参考:https://www.ag-grid.com/angul...
- 添加simple-data-table.directive指令以及相关组件
44.1 src/app/shared/simple-data-table/simple-data-http-page.component
44.2 src/app/shared/simple-data-table/simple-data-sort.component
44.3 src/app/shared/simple-data-table/simple-data-table.directive
- 补全各组件、指令、服务spec文件
- 整理目录,升级cc版本为0.0.7
46.1 business:业务功能目录
46.2 business-service:业务功能服务目录
46.3 business-shared:业务功能共享目录
46.4 error-page:错误页面目录
46.5 login:登陆模块目录
46.6 main:主体模块目录
46.7 shared:公共组件共享目录
- 添加color-picker.component组件
47.1 src/app/shared/color-picker/color-picker.component.ts
- 整理组件样式,将原来外部直接引入样式移动到组件内部引入,升级cc版本为0.0.8
- 添加step.component组件
49.1 src/app/shared/step/step.component.ts
- 添加自定义验证器,正在完善中,目前示例参考修改密码功能
50.1 src/app/shared/custom-validator/custom-validator.ts
- 添加qrcode.component组件
51.1 src/app/shared/添加qrcode/qrcode.component.ts
51.2 配置参考https://github.com/neocotic/q...
- environments配置文件添加domain(域名)属性,根据不一样环境的配置请求后端api
- 添加proxy.config.json配置文件,有须要代理的自行在package.json的start中添加--proxy-config proxy.config.json
- 添加email验证器
- 添加url与number验证器