Invisible ReCaptcha Support

[dockleryxk]

It seems to work for the most part by simply using "invisible" as the size attribute, but in order for it to work this package needs to implement grecaptcha.execute() so one may call it in the component and get the response token if needed.

[DethAriel]

Thank you a lot for submitting this!

Until this lands in 1.7.0 you can use this approach (plunker demo):

<recaptcha siteKey="YOUR_KEY"
  size="invisible"
  name="captcha"
  [(ngModel)]="captchaValue"
  #captcha
  ></recaptcha>

import {RecaptchaComponent} from 'ng2-recaptcha';

@Component({ /* ... */ })
export class SomeFormComponent {
  @ViewChild('captcha') public captcha: RecaptchaComponent;
  public captchaValue: string = null;
  
  public exec(): void {
    this.captcha.grecaptcha.execute();
  }
}

I'm afraid this might break in production (i.e. obfuscated code) due to grecaptcha reference being private. Same could be achieved with

grecaptcha.execute(this.captcha.widget);

but widget reference is also private :)

The riskiest approach is to use

grecaptcha.execute(0);

given that you're sure this is the first reCAPTCHA instance on the page, but it might not be. Anyway, I'll be adding an execute() method as soon as possible, but I need to investigate this further a little bit to ensure that edge cases are covered.

[dockleryxk]

Thank you again for writing this module! Very useful