在茉莉花中注入角度控制器答案

【问题标题】：Injecting angular controller in jasmine在茉莉花中注入角度控制器
【发布时间】：2013-11-26 22:00:14
【问题描述】：

我已经阅读了许多关于将控制器注入 jasmine 单元测试的示例，但是我不断收到“错误：[ng:areq] http://errors.angularjs.org/undefined/ng/areq?p0=MainCtrl&p1=not%20a%20function%2C%20got%20undefined”。

这是我的代码：

main.spec.js：

'use strict'

describe("Testing Main Controller", function(){
    var scope, controller;
    var dummyFunction = function(){};
    var defaultDocument = {
        _id: "123456"
    };
    beforeEach(module('app.controllers'));
    beforeEach(module('app'));
    beforeEach(inject(function($rootScope, $controller) {
        scope = $rootScope.$new();
        controller = $controller('MainCtrl', {
            $scope: scope,
            SearchService: dummyFunction,
            ResultsService: dummyFunction,
            FacetService: dummyFunction,
            EsDateService: dummyFunction,
            Likes: dummyFunction,
            Bookmarks: dummyFunction
        });
    }));
    describe("Likes", function(){
        it('shall give the user the ability to like a document that is currently being displayed.', function(){
            scope.updateLike([defaultDocument]);
            expect(defaultDocument.isLiked).toBe(true);
        });
        it('shall give the user the ability to remove a like from a document that is currently being displayed.', function(){
            defaultDocument.isLiked = true;
            scope.updateLike([defaultDocument]);
            expect(defaultDocument.isLiked).toBe(true);
        });
    });
});

main_controller.js：

'use strict';

angular.module('app.controllers')
    .controller('MainCtrl', function($scope, SearchService, ResultsService, FacetService, EsDateService, Likes, Bookmarks) {

});

app.js：

angular.module('app.services', ['ngResource', 'elasticjs.service']);
angular.module('app.controllers', [ 'app.services']);

var app = angular.module('app', [
    'ui.bootstrap',
    'elasticjs.service',
    'app.services',
    'app.controllers',
    'app.config',
    'facet.directives',
    'ngRoute']);
    app.config(['$routeProvider',
        function($routeProvider) {
            $routeProvider
                .when('/', {
                    controller: 'SearchCtrl',
                    templateUrl: 'views/search/search.html'
                })
                .when('/journal', {
                    controller: 'JournalCtrl',
                    templateUrl: 'views/journal/journal.html'
                })
                .otherwise({
                    redirectTo: '/'
                });
        }
    ]);
    app.config(['$locationProvider',
        function($locationProvider) {
            $locationProvider.hashPrefix("!");
        }
    ]);

当我将 MainCtrl 附加到 app 而不是 app.controllers 时，它似乎找到了 MainCtrl。我究竟做错了什么？

【问题讨论】：

试试这个，注入$controller并在每个it中实例化控制器。
喜欢这个？ it('shal', function($controller){ controller = $controller('MainCtrl', { $scope: scope, SearchService: dummyFunction, ResultsService: dummyFunction, FacetService: dummyFunction, EsDateService: dummyFunction, Likes: dummyFunction, Bookmarks: dummyFunction }); scope.updateLike([defaultDocument]); expect(defaultDocument.isLiked).toBe(true); });返回 TypeError: undefined is not a function
你需要注入$controller，it('...', inject(function($controller) { ... }))。
我明白了，我最终得到了同样的初始错误。 “错误：[ng:areq] errors.angularjs.org/undefined/ng/…”。我认为这与我的模块有关。如果我将 MainCtrl 附加到“app”而不是“app.controllers”，它可以工作
您的app.js 和main_controller.js 的顺序是什么？ app.js 应该在 main_controller.js 之前。

标签： javascript angularjs controller jasmine

【解决方案1】：

你不需要为应用模块重新声明依赖，因为应用模块注入了app.controllers

beforeEach(module('app'));

如何解决它的快速示例 - http://jsfiddle.net/PtXFb/

【讨论】：