PrimeNG p-checkbox – Add asterisk mandatory sign after label

Issue

Below is my p-checkbox code:

<div class="col-sm-8">
  <p-checkbox
    [(ngModel)]="allowParticipation"  
    binary="true" 
    label="I need to add red asterisk sign after this Label"     
  </p-checkbox>
</div>

How to add an asterisk sign after the label so that it should like below

(checkbox) I need to add red asterisk sign after this Label *

Solution

You can do it with CSS:

:host::ng-deep .label-required:after {
  content: " *";
  color: red;
}

and set labelStyleClass="label-required" to apply this CSS to your checkbox label.

See demo

Answered By – Antikhippe

Answer Checked By – Katrina (AngularFixing Volunteer)

Leave a Reply

Your email address will not be published.