Ng-transclude不能使用表元素

Question

我想建立一个指令来显示数据的表。

该表具有标题和正文。

理想我想有以下指令：

<div my-table></div> 
<div my-table-header></div> 
<div my-table-body></div> 

所以，我可以用NG-transclude使用它们

<div my-table> 
    <div my-table-header></div> 
    <div my-table-body></div> 
</div> 

然而，这并不与下面的模板工作，我-table：

<table class="table" ng-transclude></table> 

当页面呈现时，我最终得到以下内容：

<div my-table="" class="ng-scope"> 



      1 
      2 




      a 
      b 



     </div> 

我见过一些提到ng-transclude不能很好地处理表格的问题。例如，如果你把

<table><div ng-transclude></div></table> 

浏览器移动NG-transclude格表外

，我想知道如果任何人有任何经验，解决这个问题，因为它似乎是一个相当合理的事想做。

干杯！

Answer 1

这不是唯一的解决方案（我希望）。然而，我发现，使这项工作的唯一办法就是让我的表的tempate是

<tbody ng-transclude> 
</tbody> 

然后在标记指定上表中的指令作为一个属性

<table my-table> 
    <my-table-header></my-table-header> 
    <my-table-body></my-table-body> 
</table> 

这是唯一的形式，我已经能够使这项工作英寸

表中的元素

<table> 
    <tbody ng-transclude></tbody> 
</table> 

包缠我的表模板

或将NG-transclude上表本身

<table ng-transclude></table> 

然后实例它作为一个div或作为元素完全不

<div my-table></div> 
<my-table></mytable> 

TL工作的属性;博士

此解决方案有效，但由于以下原因，我不喜欢它：

1. 不能使用指令é形式或一个表格上表以外的任何
2. 需要嵌套<thead>外内<tbody>