angularjs1.X進階筆記(3)——如何重構controller

目錄

• 一. 結構拆分
• 二.基本代碼優化

本篇是內部培訓交流會的摘要總結。

培訓PPT和示例代碼已託管至個人github倉庫：

https://github.com/dashnowords/blogs/tree/master/Demo/rebuild-angularjs-controller

一. 結構拆分

1. 小型項目

   經過子路由實現拆分分層，父級控制器控制共享模塊，提供公共能力，子級分管本身的模塊，父子級之間經過消息機制進行通信。

1. 中型項目

   經過組合視圖實現模塊劃分，組合視圖共享同一個路由地址，分管不一樣的模塊，組合視圖之間須要經過父級控制器（或組合視圖的根控制器）來實現通信。

1. 大型項目

   經過視圖組件指令，業務模塊指令來進行更細粒度的模塊拆分，模塊通訊依然建議經過消息機制來進行。

二.基本代碼優化

1. 業務邏輯代碼

   封裝Service，經過依賴注入在Controller中或指令中使用。

2. 數據加工代碼

   建議使用表達性更強的通用工具庫underscore.js或lodash.js提高效率，精簡代碼。

3. DOM操做

   建議學習和習慣Angular數據驅動的主導思想，經過數據來啓用或消除DOM操做，具體的執行須要經過自定義指令進行實現。