zoukankan      html  css  js  c++  java
  • 将一维数组转化成二维数组

    <nz-table #colSpanTable [nzData]="temp" nzBordered>
      <tbody>
        <ng-container *ngFor="let row of temp;let i = index">   
          <tr>
            <td *ngFor="let title of row">{{title.AreaCodesName}}</td>
          </tr>
          <tr>
            <td *ngFor="let item of row">
              <div *ngFor="let content of item.Employees" nz-row nzType="flex" >
                  <div>{{ content }}</div>
              </div>
            </td>
          </tr>
        </ng-container>
      </tbody>
    </nz-table>
    import { Component, OnInit } from '@angular/core';
    import { STComponent, STColumn, STData, STChange, STPage, STColumnTag } from '@delon/abc';
    import ja_JP from 'ng-zorro-antd/i18n/languages/ja_JP';
    @Component({
      selector: 'app-card-whole-consume',
      templateUrl: './card-whole-consume.component.html',
      styleUrls: ['./card-whole-consume.component.css']
    })
    export class CardWholeConsumeComponent implements OnInit {
      data: any[] = [];
      areaList: any[] = [];
      rows;
      temp ;
      constructor() { }
      ngOnInit() {
        this.data = [
          {
            AreaCodesName: '东北地区',
            Employees: ['吉林省', '辽宁省', '黑龙江省', '黑龙江省'],
          },
          {
            AreaCodesName: '华东地区',
            Employees: ['安徽省', '江苏省', '山东省'],
          },
          {
            AreaCodesName: '西北地区',
            Employees: ['安徽省', '江苏省', '山东省'],
          },
          {
            AreaCodesName: '东南地区',
            Employees: ['安徽省', '江苏省', '山东省'],
          },
          {
            AreaCodesName: '华南地区',
            Employees: ['安徽省', '江苏省', '山东省'],
          },
          {
            AreaCodesName: '华北地区',
            Employees: ['安徽省', '江苏省', '山东省'],
          },
          {
            AreaCodesName: '西南地区',
            Employees: ['安徽省', '江苏省', '山东省'],
          },
          {
            AreaCodesName: '华中地区',
            Employees: ['安徽省', '江苏省', '山东省'],
          },
        ];
        this.setArrData(this.data);
        // 将上面数组转化成二维数组:
        // this.temp = [[{
        //   AreaCodesName: '东北地区',
        //   Employees: ['吉林省', '辽宁省', '黑龙江省', '黑龙江省'],
        //   ContentName: ['苹果', '梨子', '葡萄']
        // },
        // {
        //   AreaCodesName: '华东地区',
        //   Employees: ['安徽省', '江苏省', '山东省'],
        //   ContentName: ['香蕉', '梨子', '葡萄']
        // },
        // {
        //   AreaCodesName: '西北地区',
        //   Employees: ['安徽省', '江苏省', '山东省'],
        //   ContentName: ['香蕉', '梨子', '葡萄']
        // },
        // {
        //   AreaCodesName: '东南地区',
        //   Employees: ['安徽省', '江苏省', '山东省'],
        //   ContentName: ['香蕉', '梨子', '葡萄']
        // }], [{
        //   AreaCodesName: '华南地区',
        //   Employees: ['安徽省', '江苏省', '山东省'],
        //   ContentName: ['香蕉', '梨子', '葡萄']
        // },
        // {
        //   AreaCodesName: '华北地区',
        //   Employees: ['安徽省', '江苏省', '山东省'],
        //   ContentName: ['香蕉', '梨子', '葡萄']
        // },
        // {
        //   AreaCodesName: '西南地区',
        //   Employees: ['安徽省', '江苏省', '山东省'],
        //   ContentName: ['香蕉', '梨子', '葡萄']
        // },
        // {
        //   AreaCodesName: '华中地区',
        //   Employees: ['安徽省', '江苏省', '山东省'],
        //   ContentName: ['香蕉', '梨子', '葡萄']
        // }]];
    
      }
      // 将一维数组转化成二维数组
      setArrData(arr) {
        let num = Math.ceil(arr.length / 4);  // 2
        this.temp = new Array(num);
        for (let i = 0; i < num; i++) {
          this.temp[i] = this.data.slice(i*4, i*4+3);
        }
        // 规律: i*4  i*4+3
        // this.temp[0] = this.data.slice(0, 3);
        // this.temp[1] = this.data.slice(4, 7);
        // this.temp[2] = this.data.slice(8, 11);
        // this.temp[3] = this.data.slice(12, 15);
        // this.temp[4] = this.data.slice(16, 19);
      }
    }
  • 相关阅读:
    2331: [SCOI2011]地板 插头DP
    APIO2018 铜滚记
    2827: 千山鸟飞绝 非旋treap
    3682: Phorni 后缀平衡树 线段树
    4712: 洪水 基于链分治的动态DP
    20180507小测
    4923: [Lydsy1706月赛]K小值查询 平衡树 非旋转Treap
    5312: 冒险 线段树 复杂度分析
    5210: 最大连通子块和 动态DP 树链剖分
    4513: [Sdoi2016]储能表 数位DP
  • 原文地址:https://www.cnblogs.com/yuyedaocao/p/11008042.html
Copyright © 2011-2022 走看看