Question

我正在尝试做一个非常简单的转换，导致带有文本的div＆＃34; hi＆＃34;在输入后出现，只是为了看它在前进之前是否正常工作。这是我使用指令的标记：

 <input id="zipCodeField" validated-field />

指令定义有transclude: true并使用此模板：

<div>
    <div ng-transclude></div>
    <div>hi!</div>
</div>

我希望将input元素转换为ng-transclude在模板中的位置。相反，我得到了这个结果：

<input id="zipCodeField" validated-field>
    <div>
        <div ng-transclude></div>
        <div>hi!</div>
    </div>
</input>

我在这里做错了什么？这与我见过的例子一致。

Answer 1

我认为你误解了transclude。据我了解，transclude获取元素的内容（想想innerHTML）并将它们放在指令模板中的ng-transclude内。它不整个元素本身（outerHTML）。

因此，在您的示例中（假设指令为validated-field），您可以这样做：

<div validated-field>
    <input id="zipCodeField" />
</div>

这会导致input被放入ng-transclude元素内的指令中。

Answer 2

我不确定但乍一看，指令模板不应该像

   <div>
        <ng-transclude></ng-transclude>
        <div>hi!</div>
   </div>