Строка, добавленная директивой через «шаблон», добавляется в верхнюю часть таблицы?

Question

Код отображается следующим образом: -

шаблон директивы находится наверху, а затем отображается ада, но ожидается, что thead будет наверху.

здесь HTML

<div class="panel_content"> 
    <table summary="A table listing various other formats for this product"> 
     <thead> 
     <tr> 
      <th scope="col">Other Formats</th> 
      <th scope="col" class="site amount"><span>price</span></th> 
      <th scope="col" class="market_place amount"><span>New from</span></th> 
      <th scope="col" class="market_place amount"><span>Used from</span></th> 
      <th scope="col" class="market_place amount"><span></span></th> 
      <th scope="col" class="market_place amount"><span></span></th> 
     </tr> 
     </thead> 
     <tbody> 
      <dir></dir> 
     </tbody> 
    </table> 
    </div> 

это директива

app.directive('dir', function() { 
      return { 
       restrict: 'E', 
       replace: true, 
       template: '<tr><td>asdf</td></tr>' 
      }; 
}); 

Answer 1

tbody не ожидает вашей директивы dir тега (ожидает tr). Попробуйте изменить код, как:

app.directive('dir', function() { 
      return { 
       restrict: 'A', 
       replace: true, 
       template: '<tr><td>asdf</td></tr>' 
      }; 
}); 

и использовать

<tbody> 
    <tr dir></tr> 
</tbody>