Validation PrimeNG input components indicate validation errors automatically when their value is marked as invalid.
First Name *:
Firstname is required
Last Name *:
Lastname is required
Password *:
Password is required Must be longer than 6 characters
Description:
Gender *:
Gender is required
Form Submitted
{{diagnostic}}

export class ValidationDemo {
    
    msgs: Message[] = [];
    
    userform: ControlGroup;
    
    submitted: boolean;
    
    genders: SelectItem[];
        
    description: string;
    
    constructor(fb: FormBuilder) {
        this.userform = fb.group({
            'firstname': new Control('', Validators.required),
            'lastname': new Control('', Validators.required),
            'password': new Control('', Validators.compose([Validators.required, Validators.minLength(6)])),
            'description': new Control(''),
            'gender': new Control('', Validators.required)
        });
        
        this.genders = [];
        this.genders.push({label:'Select Gender', value:''});
        this.genders.push({label:'Male', value:'Male'});
        this.genders.push({label:'Female', value:'Female'});
    }
    
    onSubmit(value: string) {
        this.submitted = true;
        this.msgs = [];
        this.msgs.push({severity:'info', summary:'Success', detail:'Form Submitted'});
    }
    
    get diagnostic() { return JSON.stringify(this.userform.value); }
    
}


<p-growl [value]="msgs" sticky="sticky"></p-growl>
    
<form [ngFormModel]="userform" (ngSubmit)="onSubmit(userform.value)">
    <p-panel header="Validate">
        <div class="ui-grid ui-grid-responsive ui-grid-pad ui-fluid" style="margin: 10px 0px">
            <div class="ui-grid-row">
                <div class="ui-grid-col-2">
                    First Name *:
                </div>
                <div class="ui-grid-col-6">
                    <input pInputText type="text" [ngFormControl]="userform.controls['firstname']" #firstname="ngForm" placeholder="Required"/>
                </div>
                <div class="ui-grid-col-4">
                    <div class="ui-message ui-messages-error ui-corner-all" *ngIf="!firstname.valid&&firstname.dirty">
                        <i class="fa fa-close"></i>
                        Firstname is required
                    </div>
                </div>
            </div>
            <div class="ui-grid-row">
                <div class="ui-grid-col-2">
                    Last Name *:
                </div>
                <div class="ui-grid-col-6">
                    <input pInputText type="text" [ngFormControl]="userform.controls['lastname']" #lastname="ngForm" placeholder="Required"/>
                </div>
                <div class="ui-grid-col-4">
                    <div class="ui-message ui-messages-error ui-corner-all" *ngIf="!lastname.valid&&lastname.dirty">
                        <i class="fa fa-close"></i>
                        Lastname is required
                    </div>
                </div>
            </div>
            <div class="ui-grid-row">
                <div class="ui-grid-col-2">
                    Password *:
                </div>
                <div class="ui-grid-col-6">
                    <input pInputText type="password" [ngFormControl]="userform.controls['password']" #password="ngForm" placeholder="Required - Min(6)"/>
                </div>
                <div class="ui-grid-col-4">
                    <div class="ui-message ui-messages-error ui-corner-all" *ngIf="!password.valid&&password.dirty">
                        <i class="fa fa-close"></i>
                        <span *ngIf="password.errors['required']">Password is required</span>
                        <span *ngIf="password.errors['minlength']">Must be longer than 6 characters</span>
                    </div>
                </div>
            </div>
            <div class="ui-grid-row">
                <div class="ui-grid-col-2">
                    Description:
                </div>
                <div class="ui-grid-col-6">
                    <textarea pInputTextarea type="text" [ngFormControl]="userform.controls['description']"></textarea>
                </div>
                <div class="ui-grid-col-4"></div>
            </div>
            <div class="ui-grid-row">
                <div class="ui-grid-col-2">
                    Gender *:
                </div>
                <div class="ui-grid-col-6">
                    <p-dropdown [options]="genders" [ngFormControl]="userform.controls['gender']" [autoWidth]="false" #gender="ngForm"></p-dropdown>
                </div>
                <div class="ui-grid-col-4">
                    <div class="ui-message ui-messages-error ui-corner-all" *ngIf="!gender.valid&&gender.dirty">
                        <i class="fa fa-close"></i>
                        Gender is required
                    </div>
                </div>
            </div>
            <div class="ui-grid-row">
                <div class="ui-grid-col-2"></div>
                <div class="ui-grid-col-6">
                    <button pButton type="submit" label="Submit" [disabled]="!userform.valid"></button>
                </div>
                <div class="ui-grid-col-4"></div>
            </div>
            <div style="text-align:center;margin-top:20px" *ngIf="submitted">
                Form Submitted
                <br>
                {{diagnostic}}
            </div>
        </div>   
    </p-panel> 
</form>