npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

@releasium/ngx-grand-validator

v1.16.0

Published

A powerful validation library for Angular applications, providing custom validators implemented using decorators.

Downloads

14

Readme

@releasium/ngx-grand-validator

@releasium/ngx-grand-validator is a powerful and easy-to-use Angular library that simplifies the process of implementing reactive form validation in your Angular applications. With @releasium/ngx-grand-validator, developers can create models, and effortlessly add decorators to the model's fields for validation purposes. Say goodbye to writing extensive form validation logic by hand – let ngx-grand-validator handle it for you!

ngx-grand-validator

Version

| @releasium/ngx-grand-validator | Angular | |--------------------------------|---------| | 0.14.0 | v14 | | 0.15.0 | v15 | | 0.16.0 LTS | v16 | | Q4 2023 | v17 |

Features:

  • Simple Integration: Easily integrate @releasium/ngx-grand-validator into your Angular projects and get started with reactive form validation in no time.
  • Model-Based Validation: Define your data models using TypeScript classes and decorate the fields with validation decorators to describe the validation rules.
  • Schema validation. In case of complex form just create schema and work with reactive Forms
  • FormGroup Generation: Utilize the defined models to automatically generate Angular FormGroup instances with all the specified validation rules applied.
  • Declaration working with FormGroup, FormArray, FormControl as well
  • Built-in Validators: Choose from a variety of built-in validation decorators, such as @GV.required(), @GV.minLength(), @GV.maxLength(), @GV.pattern(), and more.
  • Custom Validation: Implement custom validation rules by creating your own validation decorators.
  • Error Messaging: Receive detailed error messages based on the defined validation rules to provide precise feedback to users.
  • Consistency and Maintainability: Centralize your validation logic within the models, making it easier to maintain and refactor in the future.

How to start?

Install NgxGrandValidator using NPM:

npm i @releasium/ngx-grand-validator --save

Example of using

// Your Model
export class UserModel extends GVModel {
  @GV.maxLength(120)
  @GV.minLength(5)
  @GV.required()
  firstName: string;

  @GV.maxLength(120)
  @GV.lastName(5)
  @GV.required()
  lastName: string;

  @GV.required()
  @GV.email()
  email: number;
}
 //Your Component
 this.form = UserModel.createForm();
 form.validate();
 //Yout Template
  <form
    GV [gvModel]="UserModel"
    [formGroup]="form">
  <div>
    <input type="text" formControlName="firstName">
    <gv-error-message name="firstName"></gv-error-message>
  </div>
  <div>
    <input type="text" formControlName="lastName">
    <gv-error-message name="lastName"></gv-error-message>
  </div>
  ....

Contributing:

We welcome contributions from the open-source community. If you have found a bug or have a feature request, please submit an issue or a pull request on our GitHub repository.

License:

This library is distributed under the MIT License. Feel free to use it in your commercial and non-commercial projects.