指令不在<tr>内部工作,即ng-repeat bound

Question

我有一个表格,其中行重复通过ng-repeat.我正在尝试创建一个<td>为每行生成列的模板<tr>

app.directive("customtd", function(){
  return {
    restrict: 'E',
    template: "<td>{{position.Name}}</td><td>{{position.Code}}</td>",
    replace: true,
    scope: {
      position: '='
    }
  }
});

<table>
  <tr ng-repeat="p in positions">
    <customtd position="p"></customtd>
  </tr>
</table>

问题是我的自定义td模板根本没有呈现.在这里,我打算<customtd>用n个<td>s 替换- 这将根据我的数据对象上的属性数量来决定,但目前我只是想让一个简单的指令工作,它将输出两列.

MYPLUNKER:显示此问题的实例和指令代码.

Answer 1

正如注释中所指出的,指令的模板应该具有单个根元素.所以我建议你将tr元素移动到指令的模板,如下所示:http://plnkr.co/edit/YjLEDSGVipuKTqC2i4Ng？p = preview