Javascript 从动态html编译角度指令

我似乎无法做到这一点：我有一个从ng repeat编译的HTML，我也想编译它的结果。我该怎么做呢

我有一个包含文本块的数据集，这些文本块被赋予了显示类型。此类型被设置为跨度类。大多数类型只是触发CSS规则（例如，注释样式框，请参见屏幕截图），但其他类型应该调用指令。 例如，包含“named Nicodemus”的块属于隐藏类型。我有一个指令，它折叠块并插入一个小按钮来展开它

代码：

{{chunk.text}

结果是

<span class="chunk type-hidden">named Nicodemus, </span>

名为尼哥底母，

如果第二个是我的源html，它可以很好地编译typeHidden指令。我想我需要找到一种方法让angular第二次编译。我似乎无法使用$compile完成它（尽管我想我真的不明白它是如何工作的）

希望你能帮忙

提前谢谢

以显示如何获得一个指令来编译一个元素，然后再次编译

懒惰者的代码：

angular
    .module('App')
    .directive('compileTwice', compileTwiceFactory);

function compileTwiceFactory($compile) {

    return {
        restrict: 'AE',   // Whatever you want
        terminal: true,   // Angular should not keep compiling the element
                          // by itself after encountering this directive!
        compile: compile, // Instead, we tell Angular how to compile the rest of the element
        priority: 1001,   // This directive should get compiled before the others, obviously
    };

    function compile(element, attrs) {
        element.removeAttr('compile-twice');
        element.removeAttr('data-compile-twice');

        return function postLink(scope, _element, _attrs) {
            var compiledTwice = $compile($compile(_element)(scope)[0])(scope)[0];
            // do something with compiledTwice
        };
    }

}

编辑：显然，您可以将其概括为编译任意次数，您可以这样指定：

<div compile-n-times="420"></div>

---

编辑：plunker在Firefox下似乎不起作用？

事实上，我已经通过一种解决方法解决了这个问题。虽然没有那么优雅，但如果我将指令嵌套在ngrepeat中并硬编码名称，使用ngif使其可见，它就会工作

<!-- special type hidden -->
      <span ng-if="chunk.type=='hidden'">
        <span class="type-hidden">
          {{chunk.text}}
        </span>
      </span>

{{chunk.text}

您想实现什么目标？Angular将在ng中自动“编译”指令，通常不需要显式地告诉它递归到较低的级别。也许如果你告诉我们你的“typeA”指令试图做什么，你的要求会更清楚？没有什么特别的。它隐藏内容并添加一个小按钮，使其再次可见。它似乎没有将类型a识别为需要编译为指令的东西。仅仅添加一个类

type-a

并不会自动将其变成指令。实际上，您需要编译。但是你能解释一下为什么需要这个动态指令吗？不能使用根据其类型而表现不同的泛型指令吗？为了避免一个XY问题，你能解释一下（在问题的主体部分）你想要完成什么吗？可能有一种更自然的方式来表达你的关切。我已经更新了这个问题。希望有帮助！将标记编译成其他标记，然后将生成的标记编译成另一个标记是完全可行的。然而，您的声明“如果第二个是我的源html，它将很好地编译typeHidden指令。”听起来不对。您的第二个HTML代码片段中的语法没有使Angular识别一个指令，是吗？看起来很有希望，但我似乎无法让它工作，可能是因为我的元素是ng repeat元素$compile（_element）（scope）[0]返回而不是plunker中的元素HTMLIn，请查看使用abcdef@Jurgen哦，那是因为角度指令编译为注释+实际编译的元素。如果您检查使用angular的页面的标记，您将在任何地方看到这些

和

注释（除非有禁用它们的选项？）。因此，是的，您应该在数组中查找所需的实际元素，最确定的是按标记名查找，而不是执行

[0]

，当指令的行为与您期望的一样时，这项操作才有效。容易的。

<!-- special type hidden -->
      <span ng-if="chunk.type=='hidden'">
        <span class="type-hidden">
          {{chunk.text}}
        </span>
      </span>