我正在编写一些非常复杂的DOM操作，这肯定会测试我编写非常复杂指令的能力。我没有遇到任何例子(我想无论如何)来证明我想做什么
假设我有一个小部件列表，可以是不同类型的。这些小部件需要显示在<ul>元素中。不过，每种类型的小部件都可能不同，因此<li>中每个小部件的实际标记将大不相同。
如果我所需要的只是标准标记，我认为实现这一点不会那么困难，但这些小部件中的每一个都必须创建我希望Angular处理的html片段。它们可能很简单，比如想使用ng-click，但也可能更复杂，比如也想使用我自己的自定义指令。
理想情况下，我希望分别为每个小部件创建指令，只是为了区分关注点，因为我认为大多数小部件的代码本身会非常复杂。然后，我可能想让另一个指令检查小部件的类型，并创建一个使用各个小部件指令的html片段。这有道理吗？如果没有，那么我可能想以类似的方式来区分关注点。
有办法做到这一点吗？
尽管问题有不同的解决方案，但您建议的"超级指令"策略似乎是合理的，该策略负责创建包含在某些数据结构中的小部件。正如我在评论中所说，我认为这没有任何根本问题，尽管精简它可能是一个挑战。
为了用一些工作代码来说明基本思想，使用$compile，请参阅此fiddle。
假设范围绑定的数据结构
$scope.widgets = [
{directive: 'widget-directive-one'},
{directive: 'widget-directive-two'},
];
带有模板
<ul>
<li ng-repeat="widget in widgets" super-directive="{{ widget.directive }}"></li>
</ul>
"超级指令"可以这样编译给它的指令：
angular.module('myApp').directive('superDirective', function($compile) {
return {
restrict: 'A',
link: function(scope, elem, attrs) {
// Create an element of the correct type
var widgetElement = document.createElement(attrs.superDirective);
// Possibly modify widgetElement here
// Compile the element and append it to the LI element
elem.append($compile(widgetElement)(scope));
}
};
});
将此指令视为概念证明。它可能需要大量的工作才能发挥你想要的作用，其中很大一部分取决于设计选择。