Ionic 4 Stripe.js Integration

Question

I've integrated the stripe.js into my ionic project via in the index.html.

This works fine, but I can't store the stripe.js results into a local variable.

First the code of the index.html

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="utf-8" />
  <title>Ionic App</title>

  <base href="/" />

  <meta name="viewport" content="viewport-fit=cover, width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" />
  <meta name="format-detection" content="telephone=no" />
  <meta name="msapplication-tap-highlight" content="no" />

  <link rel="icon" type="image/png" href="assets/icon/favicon.png" />

  <script src="https://js.stripe.com/v3/" async></script>

  <!-- add to homescreen for ios -->
  <meta name="apple-mobile-web-app-capable" content="yes" />
  <meta name="apple-mobile-web-app-status-bar-style" content="black" />
</head>

<body>
  <app-root></app-root>
</body>

</html>

And the home.page.ts

import { Component } from '@angular/core';
declare var Stripe;

@Component({
  selector: 'app-home',
  templateUrl: 'home.page.html',
  styleUrls: ['home.page.scss'],
})


export class HomePage {

  stripe = Stripe('my_public_key', {stripeAccount: "connected_stripe_account_key"});
  obj:any;

  constructor() 
  {}

  doCheck()
  {
    this.stripe
    .confirmCardPayment('someIntentID')
    .then(function(result) 
    {
      console.log(result.paymentIntent);
      this.obj = result.paymentIntent;
    });
  }
}

The Stripe code works finde, I'm getting the data and i can see it in the console. But I can't store it in the variable obj. I'm getting the error: Uncaught (in promise): TypeError: Cannot set property 'obj' of undefined TypeError: Cannot set property 'obj' of undefined

As I think, the problem is, that i can't acces the obj into the stripe functions. Is there a possibility to solve this problem?

Thanks!

Answer 1

You have 'this' scoping problem as it does not point into your Class within an anonymous function. Use the arrow function to avoid it:

this.stripe
    .confirmCardPayment('someIntentID')
    .then((result) =>
    {
      console.log(result.paymentIntent);
      this.obj = result.paymentIntent;
    });

Ionic 4 Stripe.js Integration

Question

1 answers

solution1
2 ACCPTED 2020-03-25 18:52:30

Ionic 4 Stripe.js Integration

Question

1 answers

solution1 2 ACCPTED 2020-03-25 18:52:30

solution1
2 ACCPTED 2020-03-25 18:52:30