Question

用例有一个表并迭代行。应使用指令

从模板中扩展每一行

HTML

<tr ng-repeat='t in data'>
  <stats stat="t"></stats>
</tr>

（上面的片段根本不呈现任何内容）

指令

app.directive('stats', function() {
     return {
        restrict: 'E',
        replace:  true,
        templateUrl: 'stats.html',
        scope: {
          stat: '='
        },
      };
});

问题1：只要在TR上定义ng-repeat，它根本不起作用。什么都没发生。没有迭代。

如果我将ng-repeat放入div中并将顶部TR标记移动到模板中，它可以正常工作，但布局被搞砸了，并且没有保留列格式。

HTML

<div ng-repeat='t in data'>
  <stats stat="t"></stats>
</div>

（上面的片段无法呈现格式正确的表格）

Answer 1

可以将指令作为属性放在行上。

<tr>有特定的允许子项，例如<td>或<th>

<tr ng-repeat='t in items' stats="t"></tr>

使用可以切换为template

的templateUrl的指令

app.directive('stats', function() {
     return {
        restrict: 'A',
        template:'<td ng-repeat="item in t">{{item}}</td>'
      };
});

的 DEMO

TR上的角度ng-repeat不允许模板指令？

1 个答案: