{"id":13481589,"url":"https://github.com/yuyang041060120/ng2-validation","last_synced_at":"2025-04-12T21:33:51.235Z","repository":{"id":48315765,"uuid":"63327277","full_name":"yuyang041060120/ng2-validation","owner":"yuyang041060120","description":"angular2 validation","archived":false,"fork":false,"pushed_at":"2023-10-10T20:32:48.000Z","size":4006,"stargazers_count":609,"open_issues_count":78,"forks_count":213,"subscribers_count":29,"default_branch":"master","last_synced_at":"2025-04-04T01:08:47.167Z","etag":null,"topics":["angular2","validation"],"latest_commit_sha":null,"homepage":"https://yuyang041060120.github.io/ng2-validation/index.html","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/yuyang041060120.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null}},"created_at":"2016-07-14T10:31:38.000Z","updated_at":"2025-02-27T21:13:00.000Z","dependencies_parsed_at":"2022-08-23T20:11:03.667Z","dependency_job_id":"1255ec7e-6264-475e-98e6-782b7e89a574","html_url":"https://github.com/yuyang041060120/ng2-validation","commit_stats":{"total_commits":67,"total_committers":15,"mean_commits":4.466666666666667,"dds":0.5970149253731343,"last_synced_commit":"2e14cea0939a4dabe3038c232a63a56e3ccec3f9"},"previous_names":["yuyang041060120/angular2-validate"],"tags_count":4,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/yuyang041060120%2Fng2-validation","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/yuyang041060120%2Fng2-validation/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/yuyang041060120%2Fng2-validation/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/yuyang041060120%2Fng2-validation/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/yuyang041060120","download_url":"https://codeload.github.com/yuyang041060120/ng2-validation/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248589867,"owners_count":21129692,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["angular2","validation"],"created_at":"2024-07-31T17:00:53.146Z","updated_at":"2025-04-12T21:33:51.213Z","avatar_url":"https://github.com/yuyang041060120.png","language":"TypeScript","funding_links":[],"categories":["Uncategorized"],"sub_categories":["Uncategorized"],"readme":"\u003e Deprecated, you can fork and publish yours.\n\n# Description\n\nAngular2 custom validation, inspired by jQuery validation.\n\n# Install\n\n```bash\nnpm install ng2-validation --save\n```\n# Systemjs\n\n```bash\n'ng2-validation': 'npm:ng2-validation/bundles/ng2-validation.umd.js'\n```\n\n# Validators\n\n## angular2 built-in validators\n\n- required\n- minlength\n- maxlength\n- pattern\n\n## custom validators\n\n- rangeLength\n- min\n- gt\n- gte\n- max\n- lt\n- lte\n- range\n- digits\n- number\n- url\n- email\n- date\n- minDate\n- maxDate\n- dateISO\n- creditCard\n- json\n- base64\n- phone\n- uuid\n- equal\n- notEqual\n- equalTo\n- notEqualTo\n\n# Usage\n\n## template driven\n\nimport `FormsModule` and `CustomFormsModule` in *app.module.ts*\n\n```javascript\nimport { NgModule } from '@angular/core';\nimport { BrowserModule } from '@angular/platform-browser';\nimport { FormsModule } from '@angular/forms';\nimport { CustomFormsModule } from 'ng2-validation'\n\nimport { AppComponent } from './app.component';\n\n@NgModule({\n    imports: [BrowserModule, FormsModule, CustomFormsModule],\n    declarations: [AppComponent],\n    bootstrap: [AppComponent]\n})\nexport class AppModule {\n}\n```\n\n### rangeLength\n\n```html\n\u003cinput type=\"text\" [(ngModel)]=\"model.field\" name=\"field\" #field=\"ngModel\" [rangeLength]=\"[5, 9]\"/\u003e\n\u003cp *ngIf=\"field.errors?.rangeLength\"\u003eerror message\u003c/p\u003e\n```\n\n### min\n\n```html\n\u003cinput type=\"number\" [(ngModel)]=\"model.field\" name=\"field\" #field=\"ngModel\" [min]=\"10\"/\u003e\n\u003cp *ngIf=\"field.errors?.min\"\u003eerror message\u003c/p\u003e\n```\n\n### gt\n\n```html\n\u003cinput type=\"number\" [(ngModel)]=\"model.field\" name=\"field\" #field=\"ngModel\" [gt]=\"10\"/\u003e\n\u003cp *ngIf=\"field.errors?.gt\"\u003eerror message\u003c/p\u003e\n```\n\n### gte\n\n```html\n\u003cinput type=\"number\" [(ngModel)]=\"model.field\" name=\"field\" #field=\"ngModel\" [gte]=\"10\"/\u003e\n\u003cp *ngIf=\"field.errors?.gte\"\u003eerror message\u003c/p\u003e\n```\n\n### max\n\n```html\n\u003cinput type=\"number\" [(ngModel)]=\"model.field\" name=\"field\" #field=\"ngModel\" [max]=\"20\"/\u003e\n\u003cp *ngIf=\"field.errors?.max\"\u003eerror message\u003c/p\u003e\n```\n\n### lt\n\n```html\n\u003cinput type=\"number\" [(ngModel)]=\"model.field\" name=\"field\" #field=\"ngModel\" [lt]=\"20\"/\u003e\n\u003cp *ngIf=\"field.errors?.lt\"\u003eerror message\u003c/p\u003e\n```\n\n### lte\n\n```html\n\u003cinput type=\"number\" [(ngModel)]=\"model.field\" name=\"field\" #field=\"ngModel\" [lte]=\"20\"/\u003e\n\u003cp *ngIf=\"field.errors?.lte\"\u003eerror message\u003c/p\u003e\n```\n\n### range\n\n```html\n\u003cinput type=\"number\" [(ngModel)]=\"model.field\" name=\"field\" #field=\"ngModel\" [range]=\"[10, 20]\"/\u003e\n\u003cp *ngIf=\"field.errors?.range\"\u003eerror message\u003c/p\u003e\n```\n\n### digits\n\n```html\n\u003cinput type=\"text\" [(ngModel)]=\"model.field\" name=\"field\" #field=\"ngModel\" digits/\u003e\n\u003cp *ngIf=\"field.errors?.digits\"\u003eerror message\u003c/p\u003e\n```\n\n### number\n\n```html\n\u003cinput type=\"text\" [(ngModel)]=\"model.field\" name=\"field\" #field=\"ngModel\" number/\u003e\n\u003cp *ngIf=\"field.errors?.number\"\u003eerror message\u003c/p\u003e\n```\n\n### url\n\n```html\n\u003cinput type=\"text\" [(ngModel)]=\"model.field\" name=\"field\" #field=\"ngModel\" url/\u003e\n\u003cp *ngIf=\"field.errors?.url\"\u003eerror message\u003c/p\u003e\n```\n\n### email\n\n```html\n\u003cinput type=\"text\" [(ngModel)]=\"model.field\" name=\"field\" #field=\"ngModel\" email/\u003e\n\u003cp *ngIf=\"field.errors?.email\"\u003eerror message\u003c/p\u003e\n```\n\n### date\n\n```html\n\u003cinput type=\"text\" [(ngModel)]=\"model.field\" name=\"field\" #field=\"ngModel\" date/\u003e\n\u003cp *ngIf=\"field.errors?.date\"\u003eerror message\u003c/p\u003e\n```\n\n### minDate\n\n```html\n\u003cinput type=\"text\" [(ngModel)]=\"model.field\" name=\"field\" #field=\"ngModel\" minDate=\"2016-09-09\"/\u003e\n\u003cp *ngIf=\"field.errors?.minDate\"\u003eerror message\u003c/p\u003e\n```\n\n### maxDate\n\n```html\n\u003cinput type=\"text\" [(ngModel)]=\"model.field\" name=\"field\" #field=\"ngModel\" maxDate=\"2016-09-09\"/\u003e\n\u003cp *ngIf=\"field.errors?.maxDate\"\u003eerror message\u003c/p\u003e\n```\n\n### dateISO\n\n```html\n\u003cinput type=\"text\" [(ngModel)]=\"model.field\" name=\"field\" #field=\"ngModel\" dateISO/\u003e\n\u003cp *ngIf=\"field.errors?.dateISO\"\u003eerror message\u003c/p\u003e\n```\n\n### creditCard\n\n```html\n\u003cinput type=\"text\" [(ngModel)]=\"model.field\" name=\"field\" #field=\"ngModel\" creditCard/\u003e\n\u003cp *ngIf=\"field.errors?.creditCard\"\u003eerror message\u003c/p\u003e\n```\n\n### json\n\n```html\n\u003cinput type=\"text\" [(ngModel)]=\"model.field\" name=\"field\" #field=\"ngModel\" json/\u003e\n\u003cp *ngIf=\"field.errors?.json\"\u003eerror message\u003c/p\u003e\n```\n\n### base64\n\n```html\n\u003cinput type=\"text\" [(ngModel)]=\"model.field\" name=\"field\" #field=\"ngModel\" base64/\u003e\n\u003cp *ngIf=\"field.errors?.base64\"\u003eerror message\u003c/p\u003e\n```\n\n### phone\n\n```html\n\u003cinput type=\"text\" [(ngModel)]=\"model.field\" name=\"field\" #field=\"ngModel\" phone=\"CN\"/\u003e\n\u003cp *ngIf=\"field.errors?.phone\"\u003eerror message\u003c/p\u003e\n```\n\ndetails see [libphonenumber](https://github.com/halt-hammerzeit/libphonenumber-js)\n\n### uuid\n\n```html\n\u003cinput type=\"text\" [(ngModel)]=\"model.field\" name=\"field\" #field=\"ngModel\" [uuid]=\"'all'\"/\u003e\n\u003cp *ngIf=\"field.errors?.uuid\"\u003eerror message\u003c/p\u003e\n```\n\n*default*: all\n\n**support**\n\n- 3\n- 4\n- 5\n- all\n\n### equal\n\n```html\n\u003cinput type=\"text\" [(ngModel)]=\"model.field\" name=\"field\" #field=\"ngModel\" [equal]=\"'xxx'\"/\u003e\n\u003cp *ngIf=\"field.errors?.equal\"\u003eerror message\u003c/p\u003e\n```\n\n### equal\n\n```html\n\u003cinput type=\"text\" [(ngModel)]=\"model.field\" name=\"field\" #field=\"ngModel\" [notEqual]=\"'xxx'\"/\u003e\n\u003cp *ngIf=\"field.errors?.notEqual\"\u003eerror message\u003c/p\u003e\n```\n\n### equalTo\n\n```html\n\u003cinput type=\"password\" ngModel name=\"password\" #password=\"ngModel\" required/\u003e\n\u003cp *ngIf=\"password.errors?.required\"\u003erequired error\u003c/p\u003e\n\u003cinput type=\"password\" ngModel name=\"certainPassword\" #certainPassword=\"ngModel\" [equalTo]=\"password\"/\u003e\n\u003cp *ngIf=\"certainPassword.errors?.equalTo\"\u003eequalTo error\u003c/p\u003e\n```\n\n### notEqualTo\n\n```html\n\u003cinput type=\"text\" ngModel name=\"password\" #password=\"ngModel\" required/\u003e\n\u003cp *ngIf=\"password.errors?.required\"\u003erequired error\u003c/p\u003e\n\u003cinput type=\"password\" ngModel name=\"certainPassword\" #certainPassword=\"ngModel\" [notEqualTo]=\"password\"/\u003e\n\u003cp *ngIf=\"certainPassword.errors?.equalTo\"\u003eequalTo error\u003c/p\u003e\n```\n\n## model driven\n\nimport `ReactiveFormsModule` in *app.module.ts*\n\n```javascript\nimport { NgModule } from '@angular/core';\nimport { BrowserModule } from '@angular/platform-browser';\nimport { ReactiveFormsModule } from '@angular/forms';\n\nimport { AppComponent } from './app.component';\n\n@NgModule({\n    imports: [BrowserModule, ReactiveFormsModule],\n    declarations: [AppComponent],\n    bootstrap: [AppComponent]\n})\nexport class AppModule {\n}\n```\n\nimport `CustomValidators` in *app.component.ts*\n\n```javascript\nimport { Component } from '@angular/core';\nimport { FormGroup, FormControl } from '@angular/forms';\nimport { CustomValidators } from 'ng2-validation';\n\n@Component({\n    selector: 'app',\n    template: require('./app.html')\n})\nexport class AppComponent {\n    form: FormGroup;\n\n    constructor() {\n        this.form = new FormGroup({\n            field: new FormControl('', CustomValidators.range([5, 9]))\n        });\n    }\n}\n```\n\n```html\n\u003cinput type=\"text\" formControlName=\"field\"/\u003e\n\u003cp *ngIf=\"demoForm.from.controls.field.errors?.rangeLength\"\u003eerror message\u003c/p\u003e\n```\n\n### rangeLength\n\n```javascript\nnew FormControl('', CustomValidators.rangeLength([5, 9]))\n```\n\n### min\n\n```javascript\nnew FormControl('', CustomValidators.min(10))\n```\n\n### gt\n\n```javascript\nnew FormControl('', CustomValidators.gt(10))\n```\n\n### max\n\n```javascript\nnew FormControl('', CustomValidators.max(20))\n```\n\n### lt\n\n```javascript\nnew FormControl('', CustomValidators.lt(20))\n```\n\n### range\n\n```javascript\nnew FormControl('', CustomValidators.range([10, 20]))\n```\n\n### digits\n\n```javascript\nnew FormControl('', CustomValidators.digits)\n```\n\n### number\n\n```javascript\nnew FormControl('', CustomValidators.number)\n```\n\n### url\n\n```javascript\nnew FormControl('', CustomValidators.url)\n```\n\n### email\n\n```javascript\nnew FormControl('', CustomValidators.email)\n```\n\n### date\n\n```javascript\nnew FormControl('', CustomValidators.date)\n```\n\n### minDate\n\n```javascript\nnew FormControl('', CustomValidators.minDate('2016-09-09'))\n```\n\n### maxDate\n\n```javascript\nnew FormControl('', CustomValidators.maxDate('2016-09-09'))\n```\n\n### dateISO\n\n```javascript\nnew FormControl('', CustomValidators.dateISO)\n```\n\n### creditCard\n\n```javascript\nnew FormControl('', CustomValidators.creditCard)\n```\n\n### json\n\n```javascript\nnew FormControl('', CustomValidators.json)\n```\n\n### base64\n\n```javascript\nnew FormControl('', CustomValidators.base64)\n```\n\n### phone\n\n```javascript\nnew FormControl('', CustomValidators.phone('zh-CN'))\n```\n\n### uuid\n\n```javascript\nnew FormControl('', CustomValidators.uuid('3'))\n```\n\n### equal\n\n```javascript\nnew FormControl('', CustomValidators.equal('xxx'))\n```\n\n### notEqual\n\n```javascript\nnew FormControl('', CustomValidators.notEqual('xxx'))\n```\n\n### equalTo\n\n```javascript\nlet password = new FormControl('', Validators.required);\nlet certainPassword = new FormControl('', CustomValidators.equalTo(password));\n\nthis.form = new FormGroup({\n  password: password,\n  certainPassword: certainPassword\n});\n```\n\n```html\n\u003cform [formGroup]=\"form\"\u003e\n  \u003cinput type=\"password\" formControlName=\"password\"/\u003e\n  \u003cp *ngIf=\"form.controls.password.errors?.required\"\u003erequired error\u003c/p\u003e\n  \u003cinput type=\"password\" formControlName=\"certainPassword\"/\u003e\n  \u003cp *ngIf=\"form.controls.certainPassword.errors?.equalTo\"\u003eequalTo error\u003c/p\u003e\n\u003c/form\u003e\n```\n\n### notEqualTo\n\n```javascript\nlet password = new FormControl('', Validators.required);\nlet certainPassword = new FormControl('', CustomValidators.notEqualTo(password));\n\nthis.form = new FormGroup({\n  password: password,\n  certainPassword: certainPassword\n});\n```\n\n```html\n\u003cform [formGroup]=\"form\"\u003e\n  \u003cinput type=\"password\" formControlName=\"password\"/\u003e\n  \u003cp *ngIf=\"form.controls.password.errors?.required\"\u003erequired error\u003c/p\u003e\n  \u003cinput type=\"password\" formControlName=\"certainPassword\"/\u003e\n  \u003cp *ngIf=\"form.controls.certainPassword.errors?.notEqualTo\"\u003enotEqualTo error\u003c/p\u003e\n\u003c/form\u003e\n```\n\n# License\n\nMIT\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fyuyang041060120%2Fng2-validation","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fyuyang041060120%2Fng2-validation","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fyuyang041060120%2Fng2-validation/lists"}