1

我在using中有 7 个用于一周中的几天 ( Monday, Tuesday, Wednesday, Thursday, Friday, Saturday, Sunday) 的复选框。fxLayoutrow

它们应该均匀分布，如果宽度变小，我希望复选框换行，而它们应该垂直对齐（考虑到日子的不同长度）。
因此，如果两天在下一行，复选框应与第一行的两天对齐。

这是我目前拥有的（复选框未正确对齐）：

app.component.html

<div fxLayout="row row-reverse" fxLayoutAlign="start center" 
fxLayoutGap="1em">
  <md-checkbox checked="true" *ngFor="let day of availableDays">
    {{day}}
  </md-checkbox>
</div>

app.component.ts

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

@Component({
  selector: 'material-app',
  templateUrl: 'app.component.html'
})
export class AppComponent {
  availableDays = ['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday', 'Sunday'];
}

这里对应的Plunk

你将如何实现我所需要的？

4

0 回答 0