ionic新手教程第三課-在項目中使用requirejs分離controller文件和server文件
繼上篇教程中提到的，我們新建一個簡單的tabs類型的Ionic項目。
依據文件夾文件我們知道，系統自己主動創建了一個controller文件和server文件，而且把全部的控制器和服務都寫到這兩個文件中面。
這是一個簡單的項目，業務邏輯代碼也非常少。這樣子實現並沒有什麽問題。可是當我們的項目越寫越多。業務邏輯越來越復雜。假設我們還是把全部的控制器寫到同一個文件中面。那可能我們將要面對的就是一個有著上萬行代碼的文件。
每次編輯僅僅能通過搜索keyword來定位了。
所以真正編輯項目的時候我們應該都是把單獨的controller分離出來的。本次教程中使用的是requirejs。
首先我們應該先把單獨的controller提取出來。保存到單獨的文件裏。第一步我們先把代碼拷貝出來，並不做改動。
先無論報錯，我們僅僅是先理解一下，文件分離的內容。
新建兩個目錄用於存放controller和server文件，便於管理。
然後我們要做的就是將單獨的controller文件和controllers文件關聯起來。
首先我們先引用requirejs文件。下載requirejs文件放到項目目錄中並在index.html中引用。
然後我們改動controllers/controllers.js文件。使他符合requireJs要求的規範。
然後分別改動單獨的controller文件。讓他們也符合規範。
通過上面的改動，應該不難發現，要把現有的項目完畢文件分離僅僅須要復制代碼就能夠了，並不須要改動業務邏輯。
接下來我們要做的就是把這些文件關聯起來。
改動controllers文件：
這樣子我們就完畢了controller文件的分離和關聯，可是有些controller文件實用到服務。所以我們也要在controllers文件裏關聯服務文件。
在controllers文件裏增加var services= require(‘services/services‘);
相同的做法，改動servers文件，將裏面的服務獨立出來。
改動後的文件文件夾和services文件例如以下。
這樣子我們就實現了controller和server文件的分離。如今我們將項目中的其它文件也改動成requireJs的規範。並使用requireJs的方式來啟動項目
改動app.js:(僅僅是多了一層封裝返回app對象。裏面的業務不做改動)
改動的地方都幾乎相同了。接下來跟著我看一下怎樣使用require的方法啟動Ionic項目。
首先在index文件裏引用requireJs的script標簽中增加 data-main="js/main.js"屬性，表示啟動入口的文件地址。
<script data-main="js/main.js" src="js/require.js"> </script>
新建main.js,這裏不做具體的配置。僅僅是定義了一個簡單的程序入口
說明程序是從bootstrap文件啟動的
新建bootstrap.js這裏做了一些簡單的推斷，假設認為不好理解的話，能夠直接啟動項目angular.bootstrap(document, [app.name]);
改動index.html去除ng-app="starter"把<body ng-app="starter">改動成<body>註意由於js文件是通過requestjs載入的，所以要把index中對js的引用去掉<!-- your app‘s js --> <!--<script src="js/app.js"></script>--> <!--<script src="js/controllers/controllers.js"></script>--> <!--<script src="js/services.js"></script>-->執行項目，正常啟動項目，從界面上看不出與新建項目的差別。到此本次教程的內容就所有完畢了。項目Demo地址：http://pan.baidu.com/s/1eSi7huE假設你還有什麽其它的問題,能夠通過下面方式找到我新浪微博:小虎Oni 微信公眾號:ionic__有其它問題的能夠關註一下公眾號提問(右側雙下劃線)：ionic__
ionic新手教程第三課-在項目中使用requirejs分離controller文件和server文件