Как добавить css на фон mat-card, если установлен флажок mat, который находится внутри содержимого mat-card? - PullRequest
1 голос
/ 27 марта 2019

Мне нужно изменить цвет фона матовой карты, когда установлен флажок, который находится внутри mat-card-content

<mat-card class="checkboxselect text-center little-profile workspacetype">
    <mat-card-content>
        <mat-checkbox class="multipleselect"></mat-checkbox>
        <div class="workspacetypeimage">
            <i class="bgi bgi-certificate"></i>
        </div>
        <mat-card-actions>
            <h4 class="m-t-0 m-b-0 typetitle">Bidder Dashboard</h4>
        </mat-card-actions>
    </mat-card-content>
</mat-card>

1 Ответ

0 голосов
/ 27 марта 2019

Есть много способов установить фон. Один из способов, который кажется мне простым и понятным, - это использовать ngStyle, но вам нужно установить флажок ngModel или нечто подобное, чтобы вы могли проверить его состояние:

<mat-card [ngStyle]="{'background': myModel? 'blue':'red'}" class="checkboxselect text-center little-profile workspacetype">
    <mat-card-content>
        <mat-checkbox [(ngModel)]="myModel" class="multipleselect"></mat-checkbox>
        <div class="workspacetypeimage">
            <i class="bgi bgi-certificate"></i>
        </div>
        <mat-card-actions>
            <h4 class="m-t-0 m-b-0 typetitle">Bidder Dashboard</h4>
        </mat-card-actions>
    </mat-card-content>
</mat-card>

демо

...