在尝试嵌入的时候,我想看看需要某个父指令控制器的被嵌入指令在被嵌入到所需的父项下后是否能够找到它。我使用的指令如下: 有一个 ParentOfParent 指令,它具有 transclude:true。有一个指令 Parent 嵌入到 ParentOfParent 指令模板中有一个 Child 指令需要 Parent 控制器,并且被 ParentOfParent 嵌入为 Parent 指令的子指令。
'use strict';
angular
.module('angularlabApp', [
'ngRoute',
])
.config(function ($routeProvider) {
$routeProvider
.when('/', {
templateUrl: 'main.html',
controller: 'MainCtrl'
})
.otherwise({
redirectTo: '/'
});
});
'use strict';
angular.module('angularlabApp')
.directive('parent', function () {
return {
controller: function () { },
restrict: 'EA',
link: function postLink(scope, element, attrs) {
console.log('Parent Link');
}
};
});
'use strict';
angular.module('angularlabApp')
.directive('parentOfParent', function () {
return {
template: '<div id="prnt" parent></div>',
transclude: true,
restrict: 'EA',
link: function(scope, element, attrs,_,transcludeFn){
console.log('POP Link');
element.find('#prnt').append(transcludeFn());
}
};
});
'use strict';
angular.module('angularlabApp')
.directive('child', function () {
return {
template: '<div></div>',
restrict: 'EA',
require:'^parent',
link: function postLink(scope, element, attrs) {
console.log('Child Link');
}
};
});
'use strict';
angular.module('angularlabApp')
.controller('MainCtrl', function ($scope) {
});
我遇到的是使用包含和不包含克隆的嵌入函数之间的奇怪差异。当我使用嵌入函数输出(不传递 cloneFn)时,我收到一个错误,即子指令无法在其上方找到父控制器。 http://plnkr.co/edit/JteQpPMc6nbVNjRDHVZ2
但是,当我通过 cloneFn 使用它时,一切正常。
嵌入指令是否有可能在插入到控制器所属的指令下方后找到所需的控制器?