開發完M層，下面，我們開始將CM進行對接. # C層 app/scripts/controllers/teacher/index.js ``` 'use strict'; /** * @ngdoc function * @name webAppApp.controller:TeacherIndexCtrl * @description * # TeacherIndexCtrl * Controller of the webAppApp */ angular.module('webAppApp') .controller('TeacherIndexCtrl', function ($scope, teacher) { // 使用回調函數來獲取數據 teacher.all(function(teachers) { $scope.teachers = teachers; }); }); ``` 保存。 但是。。。。好像shell并沒有監測到我們的文件發生了變化，也沒有為我們自動查錯。 這是，由于我們在`controllers`文件夾增加了子文件夾，而`yoman`的設計是：把所有的控制器全部寫在`controllers`文件夾中。在小型的項目中，這樣做是可以的。但考慮到以后我們可能會涉及一些與權限控制相關的中型項目，我們認為每一個`action`對應一個控制器更有利于分工。 如果還需要`grunt`為我們自動檢測代碼，并且自動測試的話，那么我們需要如下配置`gruntfile.js`. <hr /> > 以下內容修改原文件較多，修改前需要做好備份 步驟如下： 1. 打開`gruntfile.js` 2. 查找`/scripts/{`關鍵字, 并選中 3. 按ctrl + d 選中所有的字段。 4. 將其更改為`/scripts/**/{` 用同樣的方法，將`spec/{` 更改為： `spec/**/{` 保存后，執行ctrl+c，然后再執行`grunt serve`來重新啟動服務。 去除示例代碼及示例單元測試代碼，以防報錯。 > 在團隊開發中，我們的核心成員將完成項目的初始化工作。所以如果前面你感覺學習有些吃力，那么大可以跳過。我們在github中，已經為大家準備好修改后可用的gruntfile.js文件。 ## 單元測試 原則上，由于我們在C層中直接調用了M層的方法。而我們在開發C層時，又假設了兩點：1.M層已經開發完畢，并按我們的需求進行了單元測試。2.M層是由其它團隊人員開發的。所以，C層在進行單元測試時，是不需要對調用的M層的方法進行測試的。 所以在只有以上代碼的前提下，是不需要進行單元測試的。事實上，我們在進行程序開發時，C層的作用僅是調用調用這個，調用調用那個。是個指揮官，而不進行邏輯運算。所以在這種假設的前提下，C層的重點在于不能出現語法錯誤。我們的grunt又十分人性化的在代碼保存時，提示我們語法是否出錯。所以，在M層開發比較給力的前提下，C層的代碼量則會少很多。 在此，我們為了鞏固上一小節中的模擬$http請求的內容，模擬進行M層的調用，給出以下測試代碼，供選學。 <hr /> test/spec/controllers/teacher/index.js 完整代碼： ``` 'use strict'; describe('Controller: TeacherIndexCtrl', function() { // load the controller's module beforeEach(module('webAppApp')); var TeacherIndexCtrl, scope, $httpBackend; // Initialize the controller and a mock scope beforeEach(inject(function($controller, $rootScope, _$httpBackend_) { scope = $rootScope.$new(); $httpBackend = _$httpBackend_; // 定義請求 URL var url = 'resource/teacher/index/all.json'; // 定義返回數據。注意此處的json數據的寫法與xxx.json文件中的json數據的寫的法的異同。 var data = { teachers: [ { username: 'zhangsan', name: '張三', sex: 0, email: 'zhangsan@yunzhiclub.com' }, { username: 'lisi', name: '李四', sex: 1, email: 'lisi@yunzhiclub.com' }, { username: 'wangwu', name: '王五', sex: 0, email: 'wangwu@yunzhiclub.com' } ] }; // 進行模似數據請求配置.當請求方法為GET，資源名為resource/teacher/index/all.json, 返回data數據. $httpBackend.when('GET', url).respond(data); TeacherIndexCtrl = $controller('TeacherIndexCtrl', { $scope: scope // place here mocked dependencies }); })); it('測試M層的靜態數據', function() { // 模擬數據請求 $httpBackend.flush(); // 期望：返回的數組長度為3 expect(scope.teachers.length).toBe(3); }); }); ``` 保存后，shell不報錯，修改并測試成功.