Question

怎么能这样做？

我提供了一个小提琴演示我的问题：http://jsfiddle.net/FCAJD/

myApp.directive('tabs', function() {
    return {
        restrict: 'E',
        replace: true,
        transclude: true,
        template: '<ul ng-transclude></ul>'
    }
});

myApp.directive('tab', function() {
    return {
        restrict: 'E',
        replace: true,
        template: '<li>test</li>'
    }
});

和html：

<div ng-controller="MyCtrl">
  <tabs>
      <tab />
      <tab />
      <tab />
      <tab />
  </tabs>
</div>

基本上，我希望“test”多次出现

Answer 1

您需要明确终止指令。

所以而不是：

<tab /> 
...

你想：

<tab></tab>
...

Updated fiddle

您可以看到此相关Angular github issue。有一位Angular人（Igor Minar）的评论：

自我关闭或void元素，因为html规范定义它们非常特别是浏览器解析器。你不能自己做，所以对你自定义元素，你必须坚持非空元素（<foo></foo>）。

具有相同父级的Angular多指令元素

1 个答案: