Trying to do this in Angular 13:

private _stripe:StripeFactory = window['Stripe']

And it creates this error:

Element implicitly has an 'any' type because index expression is not of type 'number'

Any ideas on how to fix this?

I added:

"suppressImplicitAnyIndexErrors": true,

To tsconfig.json, but the linting errors still persist.

Trying to do this in Angular 13:

private _stripe:StripeFactory = window['Stripe']

And it creates this error:

Element implicitly has an 'any' type because index expression is not of type 'number'

Any ideas on how to fix this?

I added:

"suppressImplicitAnyIndexErrors": true,

To tsconfig.json, but the linting errors still persist.

• javascript
• angular
• typescript

• 1 Try declare const Stripe; outside of your ponent class after the import tags and use Stripe in your code – Mehyar Sawas Commented Nov 30, 2021 at 6:55

1 Answer 1

Instead of

"suppressImplicitAnyIndexErrors": true,

in tscongfig.json, it's remended to use an @ts-ignore ment on the preceding line in the .ts file:

// @ts-ignore
private _stripe:StripeFactory = window['Stripe']

But there is definitely a more 'Angular' way to do what you are trying to do, but I'm not quite sure what that is. Just extrapolating from the name of the type, I'd have a StripeFactory in the StripeService that calls a getStripe() method which has access to your Stripe configuration and key, using that to grab the global Stripe object. You'll have to load Stripe separately and inject the StripeService into the ponents that need it.

See this dev post for this Stripe specific solution in detail.

Or if you want to stick with window, you can add it to your provider array in the module:

providers: [
  { provide: Window, useValue: window }
]

Then you can inject it directly into your service:

constructor(private window: Window) {
  // ....do whatever you're gonna do
}