在包装html之前呈现指令内容

Question

我对AngularJS很新，现在我写了第一个指令。 该指令表示一个表行，标记类似于以下内容：

<table>
  <!--thead ...-->
  <tbody>
    <my-directive ng-repeat="(key, value) in object"></my-directive>
  </tbody>
</table>

但该指令在周围的表格标签之前被渲染/打印出来。 所以我的DOM看起来像这样：

<!-- multiple times -->
<my-directive></my-directive>

<table>...</table>

继承我的指令定义

return {
    restrict: "E",
    templateUrl: "/my-directive.html",
    link: function(scope, element, attrs){

    }
};

那么为什么会这样呢？

Answer 1

除了tr，td，tbody，th元素之外的其他元素永远不会在table元素内部工作。您应该使用attribute指令，以便它可以通过在指令中执行restrict: "A",来支持内部表。

<tbody my-directive ng-repeat="(key, value) in object">

</tbody>

如果你想让除了table元素之外的其他元素，那么它们可以放在th＆amp; td

Answer 2

与Pankaj所说的一样，你不能从表内调用它的指令，它的HTML无效。 但是，我可以理解为什么要使用restrict: 'E'。就个人而言，我喜欢使用我的指令作为元素。

所以，如果你仍然希望将指令用作HTML元素，最简单的解决方法是让你的指令本身呈现整个表。它可能是<table-for/>指令，或类似的东西。

这是我解决此问题的方法。标记在一天结束时是标记，你仍然必须遵守规则。