我可以在 AngularJS 中要求通用父指令吗
Can I require generic parent directive in AngularJS
子指令是否可以在不确切知道父指令是哪个指令的情况下需要父指令,只是它 "implements an interface"?
例如:
<parentImplX>
<child></child>
</parentImplX>
在上面的例子中,我希望注入子控制器的控制器是ParentImplXCtrl
。但如果我这样做:
<parentImplY>
<child></child>
</parentImplY>
我希望控制器是 ParentImplYCtrl
。
directives.directive("parentImplX", function () {
return {
scope: {},
restrict: "E",
controller: ParentImplXCtrl
}
});
directives.directive("parentImplY", function () {
return {
scope: {},
restrict: "E",
controller: ParentImplYCtrl
}
});
directives.directive("child", function () {
return {
scope: {},
restrict: "E",
require: "?^^parentInterface",
link: function ($scope, $element, attributes, parent /* type ParentInterface */) {
parent.method();
}
}
});
我发现 angular 'require' 不支持这个。但是,AngularJS 将控制器以及 $element
的 $scopes
存储在 $element.data()
结构中。因此,编写自己的 'interface require' 非常简单。您需要遍历 $element.parent().data()
并确保有要查找的标识符。就我而言 isFocusNode
。注意:`FocusNode 可以有很多实现。这才是重点。
function findFocusNodeParent(_element) {
var data = _element.data();
for (var key in data) {
var angularObject = data[key];
if (angularObject.isFocusNode && angularObject.isFocusNode()) {
return angularObject;
}
}
var _parentElement = _element.parent();
if (_parentElement.length > 0) {
return findFocusNodeParent(_parentElement);
} else {
// No parent FocusNode found. Must be root
return null;
}
}
var parentFocusNodeController = findFocusNodeParent($element);
子指令是否可以在不确切知道父指令是哪个指令的情况下需要父指令,只是它 "implements an interface"?
例如:
<parentImplX>
<child></child>
</parentImplX>
在上面的例子中,我希望注入子控制器的控制器是ParentImplXCtrl
。但如果我这样做:
<parentImplY>
<child></child>
</parentImplY>
我希望控制器是 ParentImplYCtrl
。
directives.directive("parentImplX", function () {
return {
scope: {},
restrict: "E",
controller: ParentImplXCtrl
}
});
directives.directive("parentImplY", function () {
return {
scope: {},
restrict: "E",
controller: ParentImplYCtrl
}
});
directives.directive("child", function () {
return {
scope: {},
restrict: "E",
require: "?^^parentInterface",
link: function ($scope, $element, attributes, parent /* type ParentInterface */) {
parent.method();
}
}
});
我发现 angular 'require' 不支持这个。但是,AngularJS 将控制器以及 $element
的 $scopes
存储在 $element.data()
结构中。因此,编写自己的 'interface require' 非常简单。您需要遍历 $element.parent().data()
并确保有要查找的标识符。就我而言 isFocusNode
。注意:`FocusNode 可以有很多实现。这才是重点。
function findFocusNodeParent(_element) {
var data = _element.data();
for (var key in data) {
var angularObject = data[key];
if (angularObject.isFocusNode && angularObject.isFocusNode()) {
return angularObject;
}
}
var _parentElement = _element.parent();
if (_parentElement.length > 0) {
return findFocusNodeParent(_parentElement);
} else {
// No parent FocusNode found. Must be root
return null;
}
}
var parentFocusNodeController = findFocusNodeParent($element);