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

Question

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

Мне нужно изменить цвет фона карты мат, когда флажок мат, который находится внутри 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

angular typescript angular-material parent-child mat-card

Источник

user11020757 27 мар '19 в 02:32

1 ответ

Решение

Другие вопросы по тегам angular typescript angular-material parent-child mat-card

user5468463 27 мар '19 в 04:22 2019-03-27 04:22 · Accepted Answer · 2019-03-27 04:22

Там много способов установить фон. Один из способов, который кажется мне простым и понятным, - это использовать 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>

демонстрация