1

根据AngularJS doc a/指令控制器是:

在预链接阶段之前实例化,如果它们按名称请求它,它会与其他指令共享(参见 require 属性)。这允许指令相互通信并增强彼此的行为。

在 UI 视图由容器和小部件组成的情况下,这听起来很棒且有用,小部件的链接功能可以通过声明性方法在容器指令控制器中传递require:^cotnainerDirective。这提供了一种回调容器行为的替代方法,而不是依赖于事件的通信。

例如,需要容器控制器的小部件指令如下:

angular.module('platform').directive('widget', [ function ( ) {
    return {
        restrict: 'E',
        transclude: true,
        require: '?^container',
        replace: true,
        scope: {
            layout: '=',
            model: '='
        },
        templateUrl: 'js/modules/platform/templates/form-tmpl.html',
        link: function (scope, element, iAttrs, requiredCtrl) {
            if(requiredCtrl && requiredCtrl.fooMethod){
                ....
            }
        }
    };
}]);

如果小部件位于容器内,则链接函数内的代码将完成额外的工作。代码工作正常。然而,当开始对小部件指令进行单元测试时,很难想出一种发送模拟容器指令控制器的好方法,因为它不是通过 Angular $injector 服务注入的。

可能,我需要从容器的角度编写 UT,但这不知何故涉及引导容器指令所需的太多准备工作。有人遇到过这种情况并可以在这里分享一些优点吗?

4

2 回答 2

0

事实证明,如果我想对小部件指令进行单元测试,它必须与容器松散地分离,在这种情况下使用“require”不是一个好主意,因为它实际上使小部件指令紧密依赖于容器。我已经更改了我的设计以使用事件驱动的通信 btw 小部件和容器,这样我可以简单地模拟事件侦听器来监视 UT 中的小部件指令发送的事件。

于 2013-05-16T03:00:10.100 回答
0

您可以在测试中定义一个<fake-parent>HTML 元素,然后在containerControllerMock其数据存储中添加一个$containerControllerkey。我在这里解释了这种单独测试子指令的方法:https://demisx.github.io/angularjs/unit-testing/2014/10/28/unit-testing-angular-child-directive-that-requires-parent。 html

于 2014-10-28T18:52:28.430 回答