HI Guys ,
I am getting error getCard is undefind and where to pass options ,
Sharing my implementation code below
Here is my Stripe Component ts :-
import { Component, OnInit, ViewChild, ElementRef } from '@angular/core';
import { FormGroup, FormBuilder, Validators } from "@angular/forms";
import { StripeService, Elements, Element as StripeElement, ElementsOptions, StripeCardComponent, ElementOptions } from "ngx-stripe";
@component({
selector: 'app-stripe',
templateUrl: './stripe.component.html',
styleUrls: ['./stripe.component.scss']
})
export class StripeComponent implements OnInit {
elements: Elements;
// card: StripeElement;
@ViewChild(StripeCardComponent) card: StripeCardComponent;
cardOptions: ElementOptions = {
style: {
base: {
iconColor: '#666EE8',
color: '#31325F',
lineHeight: '40px',
fontWeight: 300,
fontFamily: '"Helvetica Neue", Helvetica, sans-serif',
fontSize: '18px',
'::placeholder': {
color: '#CFD7E0'
}
}
}
};
elementsOptions:ElementsOptions = {
locale: 'es'
};
stripeTest: FormGroup;
constructor(private fb: FormBuilder,
private stripeService: StripeService) { }
ngOnInit() {
this.stripeTest = this.fb.group({
name: ['', [Validators.required]]
});
}
buy() {
debugger;
const name = this.stripeTest.get('name').value;
this.stripeService
.createToken(this.card.getCard(), { name })
.subscribe(result => {
if (result.token) {
// Use the token to create a charge or a customer
// https://stripe.com/docs/charges
console.log(result.token.id);
} else if (result.error) {
// Error creating the token
console.log(result.error.message);
}
});
}
onCardChange(event) {
console.log(event);
}
}
below HTML code
BUY
Error Screen
I am implementing in Angular 5 , any quick help is highly appreciable