angularjs - 指令中的单元测试 $routeParams

Question

我有一个访问页面 $routeParams 的指令，如下所示:

myApp.directive("myList", function ($routeParams) {
    return {
        restrict: 'E',
        templateUrl: 'tabs/my-list.html',
        link: function (scope) {
            scope.year = $routeParams.year;
       }
    };
});

该指令按预期工作并正确访问$routeParams

我正在尝试使用 angular-mock/jasmine 进行测试。我不知道如何将模拟 $routeParams 传递给指令。这就是我所拥有的:

describe('myList', function () {
    var scope, compile, element, compiledDirective;
    var mockParams = { 'year': 1996 };

    beforeEach(function () {
        module('templates', 'MyApp');

        inject(function ($compile, $rootScope, $routeParams) {
            compile = $compile;
            scope = $rootScope.$new();
        });
        element = angular.element('<my-list></my-list>');
        compiledDirective = compile(element)(scope);
        scope.$digest();
    });
    it('should fill in the year', function () {
        expect(scope.year).toEqual(mockParams.year);
    });
});

这显然不起作用，因为我从未将 mockParams 传递给指令。有办法做到这一点吗？

Answer 1

使用angular.extend模拟$routeParams对象mockParamsOR执行分配mockParams code> 对象直接到 $routeParams。这样，$routeParams 将在指令编译之前可用。

inject(function ($compile, $rootScope, $routeParams) {
    compile = $compile;
    scope = $rootScope.$new();
    angular.extend($routeParams, mockParams);
});