表格中的角度ng重复

时间:2015-04-08 13:20:35

标签: angularjs html-table angularjs-ng-repeat

我有关于角度' ng-repeat'的问题。我有一个表,在这个表中我将显示数组值。

这是我的js:

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


app.controller('MainCtrl',function($scope){

        <!--TR-->
        $scope.trZeile = new Array();
        $scope.trZeile = ['1','2','3'];


        $scope.hadi = new Array();
        $scope.hadia = new Array();
        $scope.hadi[0] = 'Mercedes1,BMW1,Ford1,VW1,Renault1,Kia1';
        $scope.hadi[1] = 'Mercedes2,BMW2,Ford2,VW2,Renault2,Kia2';
        $scope.hadi[2] = 'Mercedes3,BMW3,Ford3,VW3,Renault3,Kia3';

        for(var i = 0; i<3; i++){
            $scope.hadia = $scope.hadi[i].split(',');
        }

});

以下是一个示例:http://plnkr.co/edit/jWqyePLEvrnwFZOkFUUn

但看起来应该是这样的:

enter image description here

我怎样才能做到这一点?

1 个答案:

答案 0 :(得分:1)

这里有很多不必要的东西。我把它们切碎了。你根本不需要trZeile。此外,这一行只是简单地重新绑定相同的变量三次:

$scope.hadia = $scope.hadi[i].split(',');

这是工作代码: http://plnkr.co/edit/zz04pEDPst5Yo3thCXfy?p=preview

<强> HTML

<table ng-controller="MainCtrl" style='border:2px solid black'>
    <tr ng-repeat="row in hadia" style='border:2px solid black'>
       <th scope="row">{{$index + 1}}</th>
         <td ng-repeat="td in row track by $index" style='border:2px solid black'>
             {{td}}
          </td>
     </tr>
</table>

<强>的Javascript

var app = angular.module('plunker', []);
app.controller('MainCtrl',function($scope){
    $scope.hadia = [];
    $scope.hadi = [
       'Mercedes1,BMW1,Ford1,VW1,Renault1,Kia1',
       'Mercedes2,BMW2,Ford2,VW2,Renault2,Kia2',
       'Mercedes3,BMW3,Ford3,VW3,Renault3,Kia3'
    ]

    for(var i = 0, j = $scope.hadi.length; i< j; i++){
        $scope.hadia.push($scope.hadi[i].split(','));
    }
});