根据css/angular中多行的最大大小自动调整列的大小

<div class="container" [ngStyle]="getColumnStyles()">
  <div class="column" *ngFor="let item of items">
    {{ item }}
  </div>
</div>

.container {
  display: flex;
  flex-wrap: wrap;
}

.column {
  flex-grow: 1;
}

import { Component } from '@angular/core';

@Component({
  selector: 'app-example',
  templateUrl: './example.component.html',
  styleUrls: ['./example.component.css']
})
export class ExampleComponent {
  items = ['Item 1', 'Item 2', 'Item 3', 'Item 4', 'Item 5'];

  getColumnStyles() {
    const maxRowHeight = 100; // 设置多行的最大大小
    const columnWidth = 100 / this.items.length; // 计算每个列的宽度

    return {
      'max-height': `${maxRowHeight}px`,
      'width': `${columnWidth}%`
    };
  }
}