修剪 angularjs 指令后的代码片段

Question

我创建了一个 angularjs 元素指令，它输出一个文本区域。我已将其嵌入到父视图中，并在该元素的正下方添加了 html 的片段。出于某种原因，此代码段未呈现。有什么想法吗？

<div style="position: relative">
    <div>TEST:</div>            
    <ng-my-directive />
    <span>TEST2</span> 
</div> 

app.directive('ngMyDirective', function() {
    return {
        restrict : 'E',
        templateUrl : 'mytemplate.html',
        controller : 'MyController'
    }
});

<!-- my template -->
<textarea rows="10"></textarea>

<!-- rendered verson is missing span -->
<div style="position: relative">
    <div>NOTES:</div>           
    <ng-my-template class="ng-isolate-scope">
       <textarea rows="10" class="ng-pristine ng-valid"></textarea>
    </ng-my-template>
</div>

Answer 1

HTML 规范定义的自闭合元素对浏览器解析器来说非常特殊。你不能自己制作，所以对于你的自定义元素，你必须坚持使用非空元素

试试：

<div style="position: relative">
    <div>TEST:</div>
    <ng-my-directive></ng-my-directive>
    <span>TEST2</span> 
</div>

修剪 angularjs 指令后的代码片段

Code snippet after angularjs directive is trimmed

angularjs

trim

directive