Angularjs 角度指令ng重复生成一对元素输入+；跨度

这是我的请求，我尝试使用指令生成上述结构：

<div class='myClass'>
    <input id="id0" name="name0" type="radio" checked>
    <label for="id0" ng-click="myAction('0')"> 0</label>

    <input id="id1" name="name1" type="radio">
    <label for="id1" ng-click="myAction('1')"> 1</label>

    <input id="id2" name="name2" type="radio">
    <label for="id2" ng-click="myAction('2')"> 2</label>

    ...3,4,5...

    span(class="endSpanClass")

什么都不给

如果你能帮助我并给我一些建议，谢谢

---

J.

以下是我要做的：

<label ng-repeat="name in names">
  <input name="{{name}}" type="radio"
   ng-checked="$index==0"
   ng-click="myAction($index)"/>
  {{$index}}
</label>

{{$index}}

通过

标签包装表单控件

，这将简化代码 也要非常明确什么标签控件什么控件。 （只是一种标准的html技术。）

使用

ng checked

控制选中状态

我会避免对这个短代码使用指令，除非 它在许多地方被多次使用

若使用指令，则模板必须具有单个根元素。 （因此，您实际上可以使用上面的技巧[1]）

---

以下是一个简单的指令定义：

app.directive('myDirective', ['$timeout', function(timeout) {
    return {
      restrict: 'E',      
      scope: {id: '='},
      template: '<div><input id="id{{id}}" name="view" type="radio">' +
      '<label for="id{{id}}" ng-click="myAction(\'{{id}}\')">{{id}}</label></div>',      
      replace: true
    };
}])

app.directive（'myDirective'，['$timeout'，函数（timeout）{
返回{
限制：'E'，
作用域：{id:'='}，
模板：“”+
“{id}}”，
替换：正确
};
}])

---

还有一个工作示例：

BASarat，我们不需要容器，因为它会破坏渲染过程。看起来不错的解决方案，我会测试它，但不确定inside是否可以工作，因为在这个结构上应用了特定的过程。经过几次尝试后，我得到了一个解决方案，但这是一个“遗憾”，因为我需要迭代2次。我的标签和输入必须在Dom中处于同一级别，否则，所使用的lib将无法工作。因此，我用“label”进行了第一次ng重复，然后用属性“for”和“id”对“input”进行了另一次ng重复，然后标签和输入看起来很好。但遗憾的是，我们不能绑定ng repeat来成对地获得相同级别的元素

<label ng-repeat="name in names">
  <input name="{{name}}" type="radio"
   ng-checked="$index==0"
   ng-click="myAction($index)"/>
  {{$index}}
</label>

app.directive('myDirective', ['$timeout', function(timeout) {
    return {
      restrict: 'E',      
      scope: {id: '='},
      template: '<div><input id="id{{id}}" name="view" type="radio">' +
      '<label for="id{{id}}" ng-click="myAction(\'{{id}}\')">{{id}}</label></div>',      
      replace: true
    };
}])