找不到名称为 'grecaptcha' 的内容。

Question

我在一个Angular 2应用中有一个表单。当用户提交表单时，如果用户输入有误，则会显示验证消息。现在的问题是我需要重置reCAPTCHA小部件。我可以使用grecaptcha.reset()来实现。它运行良好。

disableSubmitButton(value) {
    grecaptcha.reset();
    this.isSubmitButtonEnabled = value; 
}

但是在typescript文件中，我遇到了一个编译器错误“找不到名称'grecaptcha'”，这导致了构建错误。

我该如何解决这个问题呢？

- dinesh sharaf

---

在类之前声明变量grecaptcha: any;，并将其放置在顶部。 - amolv

Answer 1

我遇到了同样的问题。

这个包 包含 grecaptcha 的定义。

npm install --save @types/grecaptcha

- Sasan

---

如何在组件中导入此内容？ - BALAJI R

Answer 2

我正在使用Angular 9。 我已经按照以下命令安装了grecaptcha：

npm install --save @types/grecaptcha

但是我还必须在component.ts文件中，将其在类的前面这样声明：

declare const grecaptcha: any;

- Marina Osama

Answer 3

Angular 14。

我们在app.component.ts中导入后面加上了这个：

declare global {
  interface Window {
    AdobeDC: any;
    grecaptcha: any;
  }
}

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.scss']
})
export class AppComponent {

- Mohamad Eghlima

Answer 4

在Nuxt 3和Vue中，你需要安装npm包，然后将其添加到你的tsconfig文件中。我猜Angular（或者任何其他项目）应该也是类似的。

npm install --save @types/grecaptcha

---

{
  // https://nuxt.com/docs/guide/concepts/typescript
  "extends": "./.nuxt/tsconfig.json",
  "compilerOptions": {
    "types": ["@types/grecaptcha"]
  }
}

- Leopold Kristjansson