@von-development-studio/primeng-form-validation

Angular + PrimeNG Form Validation directives.

Usage no npm install needed!

<script type="module">
  import vonDevelopmentStudioPrimengFormValidation from 'https://cdn.skypack.dev/@von-development-studio/primeng-form-validation';
</script>

README

PrimeNG Form Validation

This library was generated with Angular CLI version 11.0.3.

Installing

  1. Add NPM package into your project:
npm i @von-development-studio/primeng-form-validation -S
  1. Add VonPrimengFormModule into imports section
import { VonPrimengFormModule } from '@von-development-studio/primeng-form-validation';

...

@NgModule({
  imports: [
    ...
    VonPrimengFormModule,
    ...
  ]
})
export class AppModule { }

Usage

  1. Add attribute (validate) (instead of submit or ngSubmit) & novalidate in form tag:
<form (validate)="login()" novalidate>
  1. In each field you want to add a validation:
<input pInputText validation type="text" name="username" [(ngModel)]="login.username" [required]="true" />
  1. Your button type should be submit:
<button type="submit">Login</button>

Directives

  • required: Checks null value

    <input name="requiredField" [(ngModel)]="value" [required]="true" validation />
    
  • equalTo: Checks a value is equal to (value or variable)

    <input name="eqField01" [(ngModel)]="value01" equalTo="TEST" validation />
    
    <input name="eqField02" [(ngModel)]="value02" [equalTo]="value01" validation />
    

Default validation messages

  • requiredMessage: The field '${name}' is required
  • equalToMessage: The field '${name}' is not equal

By Von Development Studio