修改了angularjs指令後的代碼片段

Question

我創建了一個輸出textarea的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>