{"id":13481826,"url":"https://github.com/xmaestro/angular2-recaptcha","last_synced_at":"2026-03-06T03:32:26.939Z","repository":{"id":56067891,"uuid":"58126307","full_name":"xmaestro/angular2-recaptcha","owner":"xmaestro","description":"Angular 2 : Typescript component for Google reCaptcha ","archived":false,"fork":false,"pushed_at":"2020-11-27T12:02:57.000Z","size":96,"stargazers_count":79,"open_issues_count":23,"forks_count":30,"subscribers_count":7,"default_branch":"master","last_synced_at":"2025-03-29T10:03:53.730Z","etag":null,"topics":["angular2","google-recaptcha","typescript","typescript-component"],"latest_commit_sha":null,"homepage":null,"language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"isc","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/xmaestro.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE.md","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2016-05-05T11:30:21.000Z","updated_at":"2023-08-22T21:34:51.000Z","dependencies_parsed_at":"2022-08-15T12:31:21.063Z","dependency_job_id":null,"html_url":"https://github.com/xmaestro/angular2-recaptcha","commit_stats":null,"previous_names":[],"tags_count":1,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/xmaestro%2Fangular2-recaptcha","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/xmaestro%2Fangular2-recaptcha/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/xmaestro%2Fangular2-recaptcha/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/xmaestro%2Fangular2-recaptcha/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/xmaestro","download_url":"https://codeload.github.com/xmaestro/angular2-recaptcha/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247974716,"owners_count":21026744,"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","google-recaptcha","typescript","typescript-component"],"created_at":"2024-07-31T17:00:56.308Z","updated_at":"2026-03-06T03:32:21.909Z","avatar_url":"https://github.com/xmaestro.png","language":"TypeScript","readme":"![Travis](https://travis-ci.org/xmaestro/angular2-recaptcha.svg?branch=master)\n\n# Angular 2 : TypeScript component for Google reCaptcha 2\n\nThis is just very simple Angular 2 component that implements Google [reCaptcha 2](https://www.google.com/recaptcha/intro/index.html).\n\nInstallation\n--------------------------------------\n\nInstall it from npm:\n\n```bash\nnpm install angular2-recaptcha\n```\n\nUsage\n--------------------------------------\n\n### SystemJS config\n\n```js\nSystem.config({\n    map: {\n        'angular2-recaptcha': 'node_modules/angular2-recaptcha'\n    },\n    packages: {\n        app: {\n            format: 'register',\n            defaultExtension: 'js'\n        },\n        'angular2-recaptcha': {defaultExtension: 'js', main:'index'}\n    }\n});\n```\n\n### Module\n\n```typescript\n...\nimport { ReCaptchaModule } from 'angular2-recaptcha';\n...\n```\n\n```typescript\n ...\n@NgModule({\n  imports: [...,ReCaptchaModule]\n  })\n  ...\n```\n\n### View\n\nUse in template like below\n\n```html\n \u003cre-captcha site_key=\"\u003cGOOGLE_RECAPTCHA_KEY\u003e\"\u003e\u003c/re-captcha\u003e\n```\n\nWhere **site_key** is the Google reCaptcha public key. Optional parameters as follows:\n * **language** One of the ISO language values supported by Google: https://developers.google.com/recaptcha/docs/language Note that due to the design of the reCaptcha API, only the first component on a page can change the language from default English.\n * **theme** Either `light` (default) or `dark`.\n * **type** Either `image` (default) or `audio`.\n * **size** Either `normal` (default), `compact` or `invisible`.\n * **tabindex** Tabindex for navigation, default 0.\n * **global** If true, the reCaptcha script will be loaded from www.recaptcha.net instead of www.google.com\n\n\n## Callback\n\nTo catch the success callback, you will need to subscribe to the `captchaResponse` event. The response token will be passed in the `$event` parameter.\nTo wait for component to be loaded subscribe to `loaded` event.\n\n```html\n\u003cre-captcha (captchaResponse)=\"handleCorrectCaptcha($event)\" (loaded)=\"sendCaptchaExecuteHere()\" site_key=\"\u003cGOOGLE_RECAPTCHA_KEY\u003e\"\u003e\u003c/re-captcha\u003e\n```\n\nThe event `captchaExpired` is triggered when the displayed image has expired. It does not have any event parameters.\n\n## Methods\n\nTo access the methods, use [@ViewChild](https://angular.io/docs/ts/latest/api/core/index/ViewChild-decorator.html).\n\n### Import\n```typescript\nimport { ViewChild } from '@angular/core';\nimport { ReCaptchaComponent } from 'angular2-recaptcha';\n\nexport class RegisterComponent {\n  @ViewChild(ReCaptchaComponent) captcha: ReCaptchaComponent;\n}\n```\n\n### Usage\nYou can request a new captcha to be displayed:\n```typescript\nthis.captcha.reset();\n```\n\nThe previous response can be retrieved:\n```typescript\nlet token = this.captcha.getResponse();\n```\n","funding_links":[],"categories":["Uncategorized","Awesome Angular [![Awesome TipeIO](https://img.shields.io/badge/Awesome%20Angular-@TipeIO-6C6AE7.svg)](https://github.com/gdi2290/awesome-angular) [![Awesome devarchy.com](https://img.shields.io/badge/Awesome%20Angular-@devarchy.com-86BDC1.svg)](https://github.com/brillout/awesome-angular-components)"],"sub_categories":["Uncategorized","Angular \u003ca id=\"angular\"\u003e\u003c/a\u003e"],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fxmaestro%2Fangular2-recaptcha","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fxmaestro%2Fangular2-recaptcha","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fxmaestro%2Fangular2-recaptcha/lists"}