单个表的角度js中相同行的两次重复

时间:2015-11-29 05:57:14

标签: javascript angularjs angularjs-ng-repeat

我有两个数组数据我希望在第一列中显示第一个数组数据,在第二列中使用ng-repeat在第二列中显示第二个数组数据

        //First array data
$scope.users = [{name: "Jack", age: 10},{name: "Bart",age: 20}, {name: "Griffin",age: 40}];

    //Second array data
    $scope.user1 = [
       {lang: "JAva"}, 
       {lang: "C"}, 
       {lang: "C++"}];

//Expected output:
        Name-----Lang
        Jack     Java
        Bart     C
        Griffin  C++

是否可以尝试使用两次ng-repeat但是会显示第一次ng-repeat?

1 个答案:

答案 0 :(得分:2)

你的数组定义对我来说并不是那么清楚。我试着想出这个。我重新组成一个新阵列,只需重复一次。希望我理解正确

HTML

[tableView reloadData]

控制器

<div ng-app='testapp'>
    <div ng-controller='testCtrl'>
        <table>
            <tr ng-repeat='entry in repeatData'>
                <td>{{entry.user.name}}</td>
                <td>{{entry.lang.name}}</td>
            </tr>
        </table>
    </div>
</div>

请参阅此DEMO

更新

如果无法合并,可以尝试使用$ index

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

app.controller('testCtrl', function($scope){
    $scope.nameArray = [{name: "Jack", age: 10},{name: "Bart",age: 20}, {name: "Griffin",age: 40}];

    $scope.langArray = [{name: "JAva"}, {name: "C"}, {name: "C++"}];


    $scope.repeatData = $scope.nameArray.map(function(value, index) {
        return {
            user: value,
            lang: $scope.langArray[index]
        }
    });
});

像这样的东西。确保您的阵列长度正确。