【发布时间】:2015-08-30 04:24:59
【问题描述】:
我最近遇到了这个问题:
我有:directive-a,directive-b
Directive-b 有一个 `require: '^directive-a' 字段,这使得单元测试变得不可能。
我曾经在单元测试中以这种方式编译指令:
element = $compile('<directive-a></directive-a>')($scope);
然后我可以用element.isolateScope()得到隔离作用域
但是现在因为 b 依赖于 a,我不得不这样做:
element = $compile('<directive-a> <directive-b></directive-b> </directive-a>')($scope);
在这种情况下,element.isolateScope() 返回指令 a 的作用域而不是指令 b。
如何获取directive-b的范围?
演示:
指令 A:
(function(){
'use strict';
function directiveA(){
return {
restrict: 'E',
templateUrl: '/main/templates/directiveA.html',
transclude: true,
scope: {
attr1: '='
},
controller: function($scope){
//code...
},
link: function($scope, element, attrs, ctrl, transclude){
injectContentIntoTemplate();
function injectContentIntoTemplate(){
transclude(function (clone) {
element.find('#specificElement').append(clone);
});
}
}
};
}
angular
.module('myModule')
.directive('directiveA', directiveA);
}());
指令 B:
(function(){
'use strict';
function directiveB(){
return {
restrict: 'E',
templateUrl: '/main/templates/directiveA.html',
transclude: true,
replace: true,
scope: {
attr1: '@'
},
require: '^directiveA',
link: function ($scope, element, attrs, ctrl) {
$scope.customVariable = 'something';
}
};
}
angular
.module('myModule')
.directive('directiveB', directiveB);
}());
【问题讨论】:
标签: javascript angularjs unit-testing angular-directive