Search code examples
javascriptangulartypescriptstripe-paymentsionic4

Reset StripeCardComponent after adding Stripe card


I use StripeCardComponent with ngx-stripe. Do you know how to reset the form after adding the Stripe card?

<ngx-stripe-card [options]="cardOptions" [elementsOptions]="elementsOptions" (change)="cardUpdated($event)" (error)="error = $event"></ngx-stripe-card>
<div class="error">
  {{error?.message}}
</div>
<button (click)="getCardToken()" [disabled]="!complete">Get Card Token</button>

I have tried like below. But it is not working.

addcard(){
 (document.querySelector('.ElementsApp') as HTMLFormElement).reset();
}

ERROR Error: Uncaught (in promise): TypeError: Cannot read property 'reset' of null TypeError: Cannot read property 'reset' of null

Run time Html

enter image description here


Solution

  • I found the solution. This works nicely.

    addCard(){
        this.element.clear();
    }