配列からのng-repeatを使用したHTMLテーブルの作成 - angularjs、html-table、a​​ngularjs-ng-repeat

誰かがAngularJSng-repeatを使用してHTMLテーブルを作成するのを手伝ってくれませんか。そして、私は以下のような配列を持っています

cyclename = [cycle1,cycle2,cycle3]
passValue = [2,5,250]

これらを使用して、HTMLテーブルを次のように生成したかった

<table>
<tr>
<td>cycle1</td>
<td>2</td>
</tr>
<tr>
<td>cycle2</td>
<td>5</td>
</tr>
<tr>
<td>cycle3</td>
<td>250</td>
</tr>
</table>

以下のようにAngularJSで試しましたが、機能しませんでした

<table class="table">
<tr ng-repeat="x in cyclename">
<td>{{x}}</td>
</tr>
<tr ng-repeat="x in passValue">
<td>{{x}}</td>
</tr>
</table>

回答：

回答№1は2

シンプルなソリューション：

<table>
<tr ng-repeat="i in [0,1,2]">
<td>{{cyclename[i]}}</td>
<td>{{passValue[i]}}</td>
</tr>
</table>

@sachilaの回答のようなオブジェクトに値をマージすることによる「通常の」ソリューション。 配列をオブジェクトに変更する際にヘルプが必要な場合：

$scope.fullArr = cyclename.map(function(item, i) {
return {
cyclename: item,
passValue: passValue[i]
}
})

---

回答№2の場合は1

配列をineオブジェクト配列に変更します

fullArr = [{cyclename :"cycle1",passValue : "2" },{cyclename :"cycle2",passValue : "5" },{cyclename :"cycle3",passValue : "250" }]

<table class="table">
<tr ng-repeat="x in fullArr">
<td>{{x.cyclename}}</td>
<td>{{x.passValue}}</td>
</tr>
</table>

---

回答№3の場合は1

これが$ scopeを使用する最も簡単なアプローチで、以下のコードを参照してください

コントローラ：

 $scope.cyclename = ["cycle1","cycle2","cycle3"]
$scope.passValue = [2,5,250]

テンプレート

<table>
<tr ng-repeat="x in cyclename">
<td>{{x}}</td>
<td>{{passValue[$index]}}</td>
</tr>

これが欲しい プランカ 手伝います

---

回答№4の場合は0

2つの配列をキーと値のペアでマージし、ng-repeatを使用します

cyclename = [cycle1,cycle2,cycle3]
passValue = [2,5,250]

to

mergerArr=[{
key:cycle1,
value:2
},{
key:cycle2,
value:5
}]

HTMLは以下のようになります

<table class="table">
<tr ng-repeat="x in mergerArr">
<td>{{x.key}}</td>
<td>{{x.value}}</td>
</tr>
</table>

---