zoukankan      html  css  js  c++  java
  • angularjs 合并单元格

    Html:

    复制代码
    <table class="table table-striped">
      <thead>
        <tr>
          <th>国家</th>
          <th>价格(EUR)</th>
          <th>价格(CNY)</th>
          <th>备注</th>
        </tr>
      </thead>
      <tbody ng-repeat="x in tableData">
        <tr ng-repeat="y in x.list">
          <td ng-if="$index === 0" rowspan={{x.list.length}}>{{x.cnName}}</td>
          <td>{{y.eurPrice}}</td>
          <td>{{y.cnPrice}}</td>
          <td>{{y.remark}}</td>
      </tbody>
    </table>
    复制代码

    controller.js

    复制代码
    $scope.tableData = [
                  {cnName:'aaa',list:[
                                {cnPrice: '0.22',euroPrice:'0.141',remark:''},
                                {cnPrice: '0.14',euroPrice:'0.141',remark:'aa'},
                                {cnPrice: '0.35',euroPrice:'0.171',remark:'c'},
                                {cnPrice: '0.67',euroPrice:'0.51',remark:'v'}
                            ]},
                            {cnName:'bbb',list:[
                                {cnPrice: '0.22',euroPrice:'0.141',remark:''},
                                {cnPrice: '0.45',euroPrice:'0.171',remark:'c'},
                                {cnPrice: '0.67',euroPrice:'0.51',remark:'v'}
                            ]},
                            {cnName:'ccc',list:[
                                {cnPrice: '0.22',euroPrice:'0.141',remark:''},
                                {cnPrice: '0.13',euroPrice:'0.141',remark:'aa'},
                                {cnPrice: '0.35',euroPrice:'0.171',remark:''},
                                {cnPrice: '0.35',euroPrice:'0.171',remark:''},
                                {cnPrice: '0.67',euroPrice:'0.51',remark:''}
                            ]}
                        ];
    复制代码

    效果:

     

  • 相关阅读:
    Python中 sys.argv[]的用法简明解释
    Python--文件操作和集合
    Python--各种参数类型
    Python-- 字符串格式化 (%操作符)
    Python--绝对路径和相对路径
    Python3.x和Python2.x的区别
    关于ArrayList使用中的注意点
    Sun公司建议的Java类定义模板
    SWT组件之Table浅析
    mysql的相关命令整理(二)
  • 原文地址:https://www.cnblogs.com/fengxiaoliu/p/8648975.html
Copyright © 2011-2022 走看看