Javascript 对2个阵列使用ng repeat

这里有两个数组。第一个数组是选项内容，而第二个数组是选项tagi.e。A、 B、C、D.使用ng repeat时，如何进行“输入类型=收音机”的布局

在这里，我尝试先在optionTag中做w，这样我就可以有A，B，C，D作为标记。然后，我想在A和那个单选按钮后面输出OptionA

<ul ng-repeat="w in optionTag track by $index">
    <li>{{w}}
        <input type="radio" ng-value="option[$index]" ng-model="my.Choice" />{{option[$index]}}
    </li>
</ul>

在下面的代码中，它是有效的。但是，问题是，单选按钮在选项标记后出现四次。选项内容OptionA、OptionB、OptionC、OptionD现在显示出来。如何使单选按钮只显示一次，并使选项内容显示在单选按钮之后？谢谢

另一个问题。有时，选项数组中可能只有两个选项。如何仅显示选项标记A和B

角JS代码：

$scope.option=["OptionA","OptionB","OptionC","OptionD"]
$scope.optionTag=["A", "B", "C", "D"]

HTML代码：

<ul ng-repeat="w in optionTag">
  <li>{{w}}
    <input type="radio" data-ng-value="o"  ng-repeat="o in option" ng-model="my.Choice"/>{{o}}
  </li>
</ul>

---

两个数组之间需要有相关性。假设它们都以相同的方式排序，则可以在第一次ng repeat上跟踪$index，并在呈现单选按钮时引用当前索引

<ul ng-repeat="w in optionTag track by $index">
    <li>{{w}}
        <input type="radio" ng-value="option[$index]" ng-model="my.Choice" />{{option[$index]}}
    </li>
</ul>

HTML

---

您需要使用对象数组。更好的代码，更容易扩展。例如，检查链接

var myApp = angular.module('myApp',[]);

//myApp.directive('myDirective', function() {});
//myApp.factory('myService', function() {});

function MyCtrl($scope) {

$scope.option=[{Option: "A", OptionTag: "OptionA"}, {Option: "B", OptionTag: "OptionB"}, {Option: "C", OptionTag: "OptionC"}, {Option: "D", OptionTag: "OptionD"}]; 

}

---

你能举例说明它在渲染时的外观吗？你是说它在运行时的外观吗？只是，每个标签后面都有四个单选按钮。没有显示选项内容。我想做的是让输出像：选项标签，单选按钮，选项内容。

var myApp = angular.module('myApp',[]);

//myApp.directive('myDirective', function() {});
//myApp.factory('myService', function() {});

function MyCtrl($scope) {

$scope.option=[{Option: "A", OptionTag: "OptionA"}, {Option: "B", OptionTag: "OptionB"}, {Option: "C", OptionTag: "OptionC"}, {Option: "D", OptionTag: "OptionD"}]; 

}

<ul ng-repeat="w in option">
 <li>{{w.Option}}
  <form >
      <div ng-repeat=" o in option">
<input type="radio" name="select" data-ng-value="{w.OptionTg}"/> {{o.OptionTag}}
      </div>
  </form >
 </li>

</ul>
</div>