首页 > 解决方案 > 角材料复选框长文本开箱即用

问题描述

我的应用程序中有一个材料设计表格。

<div fxFlex="20%"  fxFlex.xs="100%" fxFlex.sm="33%">
    <mat-card class="mat-elevation-z4">
        <mat-card-header>
            <mat-card-title>Form</mat-card-title>
        </mat-card-header>
        <mat-card-content>
            <form action="">
                <mat-checkbox class="example-margin"  matInput name="customerInfo.isok">
                    <div class="text-wrap">
                        This is very long text tha bla bla bla bla bla bla blablabla blablablablablablablablablablablabla
                       </div>
                </mat-checkbox>
                <mat-form-field appearance="outline">
                    <mat-label>Info</mat-label>
                    <textarea  matInput name="customerInfo.info" [(ngModel)]="customerInfo.info"></textarea>
                </mat-form-field>
            </form>
        </mat-card-content>
    </mat-card>
</div>

但是我的复选框文本很长。所以它开箱即用。

在此处输入图像描述

我该如何包装它?

标签: angularangular-material

解决方案


.text-wrap {
  white-space: normal;
}

推荐阅读