angular 1.x project summary

Then the first project to use angular 1.46to do, look at the record here, before you forget

structure

- common
	- appConfig    //  处理自定义路由格式 
	- stateConfig    // 与SEP平台对接， 中间件控制器 -> 前端路由 
	- menuConfig.js  // 菜单配置
	
- config 
	- quality-analysis
		- config.js
		- view.html
	- health
	- service-warning
	- ...
	- ...
	- // 所有业务（页面）目录 

	
- router
	- routerConfig.js // 路由 


- controller
	- indexController.js
	- baseController.js 


- views
	- documents // 帮助文档（每个页面的）  
	- templates
	 	- layouts  // 页面布局
	 	- subLayouts // 子布局


- directives  
	- comCharts001.js
	- comCharts002.js
	- comTable001.js
	- ...
	- ...
	- // 所有组件


- services 
	- httpService.js  // 请求模块
	- layoutService.js  // 处理模板
	- componentService.js  // 处理组件
	- dataService.js  // 处理数据源
	- excelService.js  // 处理前端生成excel
	- ...
	- ...
	- ...


- themes
	- css


- lib
	- angular-ui-router.js // 路由
	- tinyui  // 集成了angular / 以及UI组件
	- require.js 

- assets
	- images
	- svgs

- main.js  // 入口
- app.js 
- index.html // 入口

Process

=> index.html  

=> main.js
	 -> 全局变量
	 -> 鉴权 / 获取地图数据 
	 -> angular.brootstrap() 挂载元素 
	 
=> app.js
	-> app = angular.mudule() 定义主模块
	-> app.services() 定义services
	-> app.filter() 定义过滤器
	-> app.controller(index) 定义主控制器
	
=> appConfig.js
	-> 将 routerConfig 中的路由配置处理为angular-ui-router格式
	-> 引入菜单
	
=> 打开某路由

=> baseController.js
	-> 读取config文件夹中的业务配置
	-> 定义顶层事件分发, 监听所有子级控制器的消息传播, 并转发 
	-> 通过	 layoutService.js ,componentService.js , dataService.js  // 分别处理布局/组件/数据源, 生成页面控制器
	-> 定义includes字段以引入公共模板

=> config文件夹
	-> 页面生成通过ng-includes

problem

Development still faced many problems:

1. A page through multiple htmluse of ng-includesnested layers, seemingly reusable, virtually no webpack.gulp other support, will generate a lot of parts debris, severely slow down the loading speed
2. Components are organized written directives, and internal coupling too little functionality does not comply, we need to re-write a similar
3. Config file exists a large number of repeated codes, the code repetition rate detection Effect
4. No global data stream management, two controllers communicate over-reliance baseController top, leading to the present public baseController, but if else write a large number of special Analyzing
5. This component is similar to pop, not many, but repeated written very many times, resulting in especially slow to load

solve?

• The first question, follow-up is no longer used in the form of mosaic html, but the template is written in a view.html
• Increased demand loading components, rather than put up directives defined over the whole
• The pop rewritten as a common container
• The introduction of the code compression gulp confusion, but there are a lot of angular dependency injection pit, requiring special plug-in processing

result

After some agonizing, performance is somewhat improved, but overall is not ideal
final solution is to reconstruct
if it wants to reconstruct, simply abandoned the direct angular 1, instead invest in a vue family bucket