¿Cómo usamos la clase ng deep css solo específica para solo, por ejemplo, 1 casilla de verificación y no todas las casillas de verificación en mi componente?
por ejemplo, solo quiero usar esto con mi única casilla de verificación y no con todas las casillas de mi componente. como hacemos eso ? Gracias.
Solo quiero aplicarlo en una casilla de verificación específica. porque en mi componente hay 5 casillas de verificación diferentes, pero solo quiero modificar 1 casilla de verificación, por lo que las 4 no deberían verse afectadas.
Entonces, por ejemplo, hay 2 casillas de verificación a continuación, el CSS solo debería afectar la primera casilla de verificación y no incluir la segunda.
#código de casilla de verificación
<mat-checkbox *ngIf="currentSelectedTenants(subtenant) else currentSubtenants" color="accent" [(ngModel)]="dealDispositionFormFields.currentSubtenants" [checked]="currentSelectedTenants(subtenant)" (change)="changeCurrentSubtenants($event,subtenant)" style="margin-left:10px;"> <mat-label class="alter-text-color" style="font-size: 12px;">{{subtenant.subtenantName}}</mat-label> </mat-checkbox> <mat-checkbox *ngIf="currentSelectedTenants(subtenant) else currentSubtenants" color="accent" [(ngModel)]="dealDispositionFormFields.notCurrentSubtenant" [checked]="currentSelectedTenants(subtenant)" (change)="changeCurrentSubtenants($event,subtenant)" style="margin-left:10px;"> <mat-label class="alter-text-color" style="font-size: 12px;">{{subtenant.subtenantName}}</mat-label> </mat-checkbox>#css
::ng-deep .mat-checkbox-checkmark-path { stroke:rgba(0, 125, 255, 1) !important; }Puede agregar mat-checkbox dentro de un div y asignarle una class :
<div class="new-class"> <mat-checkbox> </mat-checkbox> </div>Y tu css se verá así:
::ng-deep .new-class .mat-checkbox-checkmark-path { stroke:rgba(0, 125, 255, 1) !important; } PD: puede nombrar new-class según sus requisitos
Use una clase css en la casilla de verificación mat que desea personalizar:
<mat-checkbox class="custom-mat-checkbox"> ... </mat-checkbox>Y luego personalízalo a través de CSS.
::ng-deep mat-checkbox.custom-mat-checkbox { // custom css goes here }