{"id":17458125,"url":"https://github.com/pocesar/angular-async-validator","last_synced_at":"2025-03-21T03:33:38.499Z","repository":{"id":30746999,"uuid":"34303459","full_name":"pocesar/angular-async-validator","owner":"pocesar","description":"Directives and service for reusable async validators, write once, use everywhere.","archived":false,"fork":false,"pushed_at":"2016-06-30T15:02:19.000Z","size":110,"stargazers_count":7,"open_issues_count":1,"forks_count":0,"subscribers_count":3,"default_branch":"master","last_synced_at":"2024-04-28T12:04:48.395Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"https://pocesar.github.io/angular-async-validator","language":"JavaScript","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/pocesar.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2015-04-21T04:07:43.000Z","updated_at":"2021-03-22T13:23:00.000Z","dependencies_parsed_at":"2022-08-19T09:50:16.887Z","dependency_job_id":null,"html_url":"https://github.com/pocesar/angular-async-validator","commit_stats":null,"previous_names":[],"tags_count":9,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/pocesar%2Fangular-async-validator","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/pocesar%2Fangular-async-validator/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/pocesar%2Fangular-async-validator/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/pocesar%2Fangular-async-validator/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/pocesar","download_url":"https://codeload.github.com/pocesar/angular-async-validator/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":244734070,"owners_count":20501014,"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":[],"created_at":"2024-10-18T03:54:59.841Z","updated_at":"2025-03-21T03:33:37.811Z","avatar_url":"https://github.com/pocesar.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"[![Build Status](https://travis-ci.org/pocesar/angular-async-validator.svg?branch=master)](https://travis-ci.org/pocesar/angular-async-validator) [![Coverage Status](https://coveralls.io/repos/pocesar/angular-async-validator/badge.svg)](https://coveralls.io/r/pocesar/angular-async-validator)\n\n[![NPM](https://nodei.co/npm/angular-async-validator.png)](https://nodei.co/npm/angular-async-validator/)\n\nAngular Async Validator\n=====\n\nThis module enables you to register your own validation rules, or overwrite existing ones. Makes every validation 'promise based', so it can deal with both synchronous  and asynchronous validations. Also, sometimes you want validate an entire form when a model changes, which currently there are no good ways to do this, hence this module, because\nvalidation and form manipulation in Angular 1.x is a pain by itself.\n\nProvides no validation functions out-of-the-box. You may reuse the ones from Angular without a problem.\n\nCode was based off [ui-validate](http://angular-ui.github.io/ui-utils/#/validate) initially, but it's too simple and lagging behind still using $parsers and $formatters since it need to retain 1.2 compatibility.\n\nThis module requires Angular 1.3+, and has no dependencies other than Angular itself.\n\nIt also supports 3rd party promise libraries such as RSVP, Q, Bluebird, etc.\n\n[DEMO](http://embed.plnkr.co/oFVFE7/preview)\n\n## Motivation\n\nCurrent module implementations only deal with sync validations, validators set in scopes or controllers,\nor provide 1 directive for each type of validation (`validate-number`, `validate-presence`, `validate-stuff`, etc), which is an overkill.\n\nAsync should be norm, and regardless if the validation itself isn't asynchronous, because the UI is asynchronous afterall. Plus there are a plethora of quality validation Javascript libraries, having to rely on Angular built-in ones is too limited, or you having to write a directive for each validation you need is also overkill.\n\nMain goal is to be able with few reusable directives to rule them all, plus 1 service and 1 provider in a concise\nmodule that does it's job well without all the bells and whistles.\n\n## Install\n\n### NPM\n\n```\n$ npm instal angular-async-validator --save\n```\n\n### Bower\n\n```\n$ bower install angular-async-validator --save\n```\n\n## Usage\n\n```js\nangular.module('yourapp', [\n   // add this module\n   'AsyncValidator'\n])\n// Configure your validators\n.config(['AsyncValidatorProvider', function(AsyncValidatorProvider){\n\n  AsyncValidatorProvider\n  // register new reusable validation\n  .register('name', ['SomeHttpService', function(SomeHttpService){\n    // treat your validator like a service\n    return function(value, options, model){ // receives the full blown ngModelController\n      return SomeHttpService.check(model.$$rawViewValue).then(function(returnedFromServer){\n        if (returnedFromServer.status === 'ok') {\n          return true; // returning boolean is fine, you can throw to break the validation\n        }\n        return false; // may reject using $q.reject() as well, but since false will forcefully reject the validation\n      });\n    }\n  }])\n  // by default, when the validation is truthy, the final AsyncValidator.run() call will have the ngModel.$viewValue\n\n  .register('required', [function(){\n    return function(value, options, model){\n      // options === {}\n      // model.$viewValue / model.$error etc\n      return angular.isDefined(value);\n    };\n  }], { silentRejection: false })\n\n  .register('usingValidateJs', [function(){\n    return function(value, options){\n      if (options.someExtraOptions) {\n        console.log('extra options');\n      }\n      return validate.single(value, {\n        presence: true,\n        length: {\n          minimum: 5\n        },\n        format: /1910-100/\n      });\n    };\n  }], { options: { someExtraOptions: true} })\n\n  register('equals', function(){\n    return function(value, options) {\n      if (!angular.isDefined(options.to)) {\n        return false;\n      }\n      return angular.equals(value, options.to);\n    };\n  }, { removeSync: true })\n  ;\n\n}])\n// reuse validation programatically\n.controller('Ctrl', ['AsyncValidator', function(AsyncValidator){\n\n  AsyncValidator.run('name', 'Validate this string', { inlineOptions: true }).then(function(currentValidValue){\n    // worked\n    currentValidValue === 'Validate this string'\n  }, function(){\n    // failed\n\n  });\n\n  this.controllerValidation = function($value){\n     return $value === 'asdf';\n  };\n\n  this.data = {\n      n1: 'asdf',\n      n2: '1234',\n      n3: 'fsa',\n      n4: 'fda',\n      n5: 'dsa',\n      n6: 'ds',\n      n7: 'dsaa',\n      value: '2',\n      ok: 'ok'\n  };\n\n  this.hasChanged = false;\n}]);\n```\n\nUse it in your HTML input ng-models (notice they are all expressions, therefore need to be a string):\n\n```html\n\u003cdiv ng-controller=\"Ctrl as ctrl\"\u003e\n\n   \u003cinput\n      async-validator=\"{ required: 'required' }\"\n      async-validator-options=\"{ inline: true }\"\n      ng-model=\"ctrl.data.n1\"\n      type=\"text\"\n      \u003e\n\n   \u003cinput\n      async-validator=\"'$model.$modelValue.length \u003e 3'\"\n      async-validator-options-validator=\"{ outline: true }\"\n      ng-model=\"ctrl.data.n2\"\n      type=\"text\"\n      \u003e\n\n   \u003cinput\n      async-validator=\"['strongpassword','length']\"\n      ng-model=\"ctrl.data.n3\"\n      type=\"text\"\n      \u003e\n\n   \u003cinput\n      async-validator=\"'equals'\"\n      async-validator-options-equals=\"{ to: ctrl.data.n3 }\"\n      async-validator-watch=\"ctrl.data.n3\"\n      ng-model=\"ctrl.data.n4\"\n      type=\"text\"\n      \u003e\n\n   \u003cinput\n      async-validator=\"'nome'\"\n      async-validator-options-nome=\"{ forNome: 'ok' }\"\n      ng-model=\"ctrl.data.n5\"\n      type=\"text\"\n      \u003e\n\n   \u003cinput\n      async-validator=\"{ custom: 'ctrl.controllerValidation($value)' }\"\n      ng-model=\"ctrl.data.n6\"\n      type=\"text\"\n      \u003e\n\n   \u003cinput\n      async-validator=\"{ inline: '$value != ctrl.data.ok \u0026\u0026 !$error.required' }\"\n      required\n      ng-model=\"ctrl.data.n7\"\n      type=\"text\"\n      \u003e\n      \u003c!-- can mix synchronous angular validations with async, in this case, using the \"required\" --\u003e\n\u003c/div\u003e\n```\n\nThe helper attribute `async-validator-watch` can watch an expression. If it changes (regardless if truthy or falsy) will trigger the `$validate()` call on the ngModel.\n\n```html\n   \u003cinput\n      async-validator-watch=\"'ctrl.hasChanged'\"\n      async-validator=\"'$model.$viewValue != ctrl.data.value'\"\n      ng-model=\"data.n6\"\n      type=\"text\"\n      \u003e\n   \u003cinput\n      async-validator-watch=\"ctrl.data\"\n      async-validator=\"'$model.$viewValue != ctrl.data.value'\"\n      ng-model=\"data.n6\"\n      type=\"text\"\n      \u003e\n   \u003cinput\n      async-validator-watch=\"['ctrl.data','ctrl.hasChanged']\"\n      async-validator=\"'$model.$viewValue != ctrl.data.value'\"\n      ng-model=\"data.n6\"\n      type=\"text\"\n      \u003e\n```\n\nFor your own options that apply to all validators, use `async-validator-options=\"{}\"`. If you need to specify specifically for one validator write it as `async-validator-options-REGISTEREDNAME=\"{}\"`. Scope and controller variables can be referenced in the options.\n\nThe options goes to the least specific and get merged as it becomes more specific. For example:\n\n```html\n  \u003cinput\n    async-validator=\"['required','specific']\"\n    async-validator-options=\"{lol: 'yes', ok: true}\"\n    async-validator-options-specific=\"{ok: false}\"\n    \u003e\n  \u003c!-- required validator will receive the {lol: 'yes', ok: true} --\u003e\n  \u003c!-- specific validator will receive the {lol: 'yes', ok: false} --\u003e\n```\n\nLocals available:\n\n* `$value` current `$modelValue`, might be undefined / NaN\n* `$error` current `$error` in the underlaying ng-model\n* `$model` current ng-model exposed\n* `$options` current merged `async-validation-options-*`\n\n`async-form-validator` and `async-group-validator` can apply validations and options to the children ngModels.\n\nFor `async-form-validator`, every named ngModel will be automatically added. If you want to exclude one model, add the `async-validator-exclude` to the element. You can also add non-named ngModels using `async-validator-add`.\n\nFor `async-group-validator`, you can use common validators for a group of ngModels, but they don't add themselves automatically like `async-form-validator` does, you need to manually add them using `async-validator-add`. `async-group-validator` has precedence over a `async-form-validator`, so you can overwrite a group inside a form.\n\nOptions are also merged from top to bottom (`async-form-validator` \u003e `async-group-validator` \u003e `async-validator-options` \u003e `async-validator-options-validator`)\n\n```html\n\u003cform async-form-validator=\"{ required: 'required', dummy: 'ctrl.controllerValidation($value)' }\"\u003e\n  \u003cinput\n      type=\"email\"\n      name=\"email\"\n      ng-model\"ctrl.data.email\"\u003e\n  \u003c!-- value will have to pass Angular internal required and our registered dummy validator --\u003e\n\n  \u003cinput\n      type=\"tel\"\n      ng-model\"ctrl.data.phone\"\n      async-validator-add\n      \u003e\n  \u003c!-- value will have to pass Angular internal required and our registered dummy validator --\u003e\n\n  \u003c!-- apply the same validator to the models in the group --\u003e\n\n  \u003cdiv async-group-validator=\"{ required: 'notrequired' }\" async-validator-options=\"{ ok: true }\"\u003e\n    \u003cinput\n        type=\"tel\"\n        ng-model\"ctrl.data.street\"\n        async-validator-add\n        \u003e\n\n    \u003cinput\n        type=\"text\"\n        ng-model\"ctrl.data.number\"\n        async-validator-add\n        \u003e\n\n    \u003cinput\n        type=\"text\"\n        ng-model\"ctrl.data.complement\"\n        async-validator=\"{ myownrequired: 'bymyown' }\"\n        async-validator-exclude\n        \u003e\n\n    \u003c!-- async-validator-exclude will exclude the parent controller to add the validators to it --\u003e\n\n  \u003c/div\u003e\n\u003c/form\u003e\n```\n\n## Options\n\nWhen registering a validator, you can pass your own options to it using the third parameter as an object and setting the `options` member.\n\n* `options` any options that the validator function receives as the second parameter, defaults to `{}`\n\n* `overwrite` if you set to false, it will throw if there's another validator with same name, defaults to `true`\n\n* `removeSync` removes synchronous validators if they have the same name as your registered validator, defaults to `true`. Eg: using `\u003cinput ng-model=\"model\" required async-validator=\"'required'\"\u003e` will delete the default `required` validator\n\n* `silentRejection` if sets to false, will rethrow the error. will turn any throws and rejections into an \"invalid\" validation, defaults to true.\n\n## License\n\nMIT\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fpocesar%2Fangular-async-validator","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fpocesar%2Fangular-async-validator","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fpocesar%2Fangular-async-validator/lists"}