Question

如何为第三列设置rowspan。尝试创建具有三列的表，但它不起作用。 http://jsfiddle.net/c47xK/619/

angular.module('App',[]);
angular.module('App').controller('MyCtrl',function($scope){
    $scope.groups = [{
        "id":1,
        "members":[
            {"name":"Sue", "friend":[{"frend": "100"},{"frend": "200"}]},
            {"name":"Jane","friend":[{"frend": "300"},{"frend": "400"}]},
            {"name":"Edna","friend":[{"frend": "500"},{"frend": "600"}, {"frend": "700"}]}
        ]
    },{
        "id":2,
        "members":[

            {"name":"James","friend":[{"frend": "800"},{"frend": "900"}, {"frend": "1000"}]}
        ]
    }];
});

Answer 1

非常棘手且有趣的问题！不知道如何使用表格来实现这一目标。但是可以使用css以表格形式显示。

<div class="row border" ng-repeat="group in groups">
    <div class="col-xs-2">
      {{group.id}}
    </div>
    <div class="col-xs-10 border">
      <div class="row border"  ng-repeat="member in group.members">
        <div class="col-xs-6">
          <div>{{member.name}}</div>
        </div>
        <div class="col-xs-6">
          <div class="border" ng-repeat="friend in member.friend">{{friend.frend}}</div>
        </div>
      </div>

工作jsfiddle link供您参考。有兴趣了解其他解决方案，如果您找到了！

如何为表格第三列设置rowspan？

1 个答案: