Question

我正在测试一个指令（＆＃39; planListing＆＃39;），该指令依赖于名为“planListingService＆＃39;”的服务。此服务依赖于另一个名为“ajax”的服务。（不要为不良名字射击使者）。

我能够编译指令，加载其范围并使用CAVEAT获取控制器。到目前为止，我被迫嘲笑这两项服务＆plan.gistingService＆＃39;和＆＃39; ajax＆＃39;否则我会收到这样的错误：

错误：[$ injector：unpr]未知提供者：ajaxProvider＆lt; - ajax＆lt; - planListingService http://errors.angularjs.org/1.3.20/ $注射器/ unpr？P0 = ajaxProvider％20％3 C-％20ajax％20％3 C-％20planListingService

我之所以这么认为是因为我在嘲笑“计划服务”。我不必为这项服务的任何实现或任何依赖项而烦恼。我期待太多了吗？

简而言之，这是代码：

planListing.js

angular.module('myApp')
    .directive('planListing', planListing)
    .controller('planListingCtrl', PlanListingCtrl);

 function planListing() {
    var varDirective = {
        restrict: 'E',
        controller: PlanListingCtrl,
        controllerAs: 'vm',
        templateUrl: "scripts/directives/planListing/planListing.html";
        }
    };
    return varDirective;
}
PlanListingCtrl.$inject = ['planListingService'];
function PlanListingCtrl(planListingService) {
    ...
}

planListingService.js

angular.module('myApp')
    .factory('planListingService', planListingService);
planListingService.$inject = ['$q', 'ajax'];
function planListingService($q, ajax) {
    ...
}

ajax.js

angular.module('myApp')
    .factory('ajax', ['backend', '$browser', 'settings', '$http', '$log',
  function (backend, $browser, settings, $http, $log) {
    ...

planListing.spec.js

describe('testing planListing.js',function(){

    var el,ctrl,scope,vm;
    var service;

    module('myApp');
    module('my.templates');

    beforeEach(module(function ($provide){
        // This seems to have no effect at all, why?
        $provide.service('planListingService', function () {
            this.getAllPricePlans=function(){};
        });
        // I don't get the error if I uncomment this:
        // $provide.service('ajax', function ($q) {
        //  this.getAllPricePlans=function(){};
        // });
    }));

    beforeEach(function() {
        module('myApp');
        module('my.templates');
    });

    beforeEach(angular.mock.inject(function (_$compile_,_$rootScope_,_$controller_){
        $compile=_$compile_;
        $rootScope = _$rootScope_;
        $controller = _$controller_;
        el = angular.element('<plan-listing></plan-listing>');
        scope = $rootScope.$new();
        $compile(el)(scope);
        scope.$digest();

        ctrl = el.controller('planListing');
        scope = el.isolateScope() || el.scope();
        vm = scope.vm;
    }));

    describe('testing compilation / linking', function (){
        it('should have found directive and compiled template', function () {
            expect(el).toBeDefined();
            expect(el.html()).not.toEqual('');
            expect(el.html()).toContain("plan-listing-section");
        });
    });
    it('should have a defined controller',function(){
        expect(ctrl).toBeDefined();
    });
    it('should have a defined scope',function(){
        expect(ctrl).toBeDefined();
    });
});

那么为什么我需要嘲笑＆＃39; ajax＆＃39;虽然我正在嘲笑“计划列表服务”，但仍提供服务。这是一个叫'ajax＆＃39;服务吗

谢谢！

Answer 1

我一直在那里......感觉开始不好但是我认为你的指令取决于服务而你需要注入它以便指令可以使用它，只需通过调用指令它并不意味着它会在你的测试中注入它。它会寻找它，如果没有注入它会给你错误

你可以在测试你的指令之前这样做

btnReportingExport

Answer 2

出于文档目的，这里是答案（感谢@estus注意到这一点）：

确实问题与我的模块初始化不正确有关。而不是：

    // Why not just try to call 
    value v(b_utf8("test"));
    // instead
    value v({b_utf8("test")});
    // ?

我应该这样做：

describe('testing planListing.js',function(){

    var el,ctrl,scope,vm;
    var service;

    module('myApp');
    module('my.templates');
    ...

之后事情开始按预期再次运作。

服务内部的茉莉花嘲弄服务

2 个答案: