角度とHTML：角度$スコープのHTMLテーブル行ベースの項目数をプログラムで作成します。var

Question

現在、Angularを使用してHTMLテーブルにデータを入力しています。今、私は手動で各行を表示用にコーディングしていますが、プログラムで各HTML行を定義するソリューションを探しています。以下のAngularコントローラは、forループを使用して多くの行のデータを取り込むため、単純化されています。

これらの行をそれぞれ定義するためのプログラム的なHTMLソリューションはありますか？

HTML

<tr> 
    <td>{{oneCategory}}</td> 
    <td>{{oneDesc}}</td> 
    <td>{{oneNote}}</td> 
    <td ng-repeat="rowOne in one">{{ rowOne.value }}</td> 
</tr> 
<tr> 
    <td>{{twoCategory}}</td> 
    <td>{{twoDesc}}</td> 
    <td>{{twoNote}}</td> 
    <td ng-repeat="rowTwo in two">{{ rowTwo.value }}</td> 
</tr> 
<tr> 
    <td>{{threeCategory}}</td> 
    <td>{{threeDesc}}</td> 
    <td>{{threeNote}}</td> 
    <td ng-repeat="rowThree in three">{{ rowThree.value }} 
</td> 
</tr> 

角度コントローラ

var row2wordOBJ = {0: 'one', 1: 'two', 2:'three', 3: 'four', 4:'five', 
5:'six', 6:'seven', 7:'eight', 8:'nine', 9:'ten', 10:'eleven', 11:'twelve'} 

var objKeys_responseData = Object.keys(response.data) 
// outer loop controls the object key pointer                                  
for(a=0; a < objKeys_responseData.length; a++){ 
var objKey = objKeys_responseData[a] 
    for(b=0; b < response.data[objKey_responseData].length; b++){ 
     var row = row2wordOBJ[b] 
     $scope[row + 'Category'] = response.data[objKey][b].category 
     $scope[row + 'Desc'] = response.data[objKey][b].desc 
     $scope[row + 'Note'] = response.data[objKey][b].note 
     $scope[row] = response.data[objKey][b].value 
     } 
    } 

EDITまたニティンWaliaが提供する

第二の溶液。最終的なロジックは、htmlテーブルデータの表示をどのように制御する必要があるかによって異なります。両方の答えが機能します。 /////////

角度コントローラ

$scope.item1 = response.data[key1] 
$scope.item2 = response.data[key2] 

HTML

<tr ng-repeat="data in item1"> 
    <td>{{data.category}}</td> 
    <td>{{data.oneDesc}}</td> 
    <td>{{data.note}}</td> 
    <td ng-repeat="val in data.value">{{ val.value }}</td> 
</tr> 
<tr ng-repeat="data in item2"> 
    <td>{{data.category}}</td> 
    <td>{{data.oneDesc}}</td> 
    <td>{{data.note}}</td> 
    <td ng-repeat="val in data.value">{{ val.value }}</td> 
</tr> 

Answer 1

トライNGリピート

角度

$scope.item =[]; 
    for(b=0; b < response.data[objKey_responseData].length; b++){ 
    $scope.item[b].category = response.data[objKey][b].category 
    $scope.item[b].Desc = response.data[objKey][b].desc 
    $scope.item[b].Note = response.data[objKey][b].note 
    $scope.item[b].value = response.data[objKey][b].value 
    } 

HTML

<tr ng-repeat="data in item"> 
    <td>{{data.category}}</td> 
    <td>{{data.oneDesc}}</td> 
    <td>{{data.note}}</td> 
    <td ng-repeat="val in data.value">{{ val.value }}</td> 
</tr> 

これを行う未定義のエラーを修正するには、[編集] ..

$scope.item =[]; 
    for(b=0; b < response.data[objKey_responseData].length; b++){ 
    var itemObj = { 
     'category' : response.data[objKey][b].category, 
     'desc' :response.data[objKey][b].desc, 
     'Note' : response.data[objKey][b].note, 
     'value': response.data[objKey][b].value 
    } 
    $scope.item.push(itemObj); 
    }