Stripe plugin expire card date


#1

I’m using the plugin NativeScript Stripe(https://github.com/triniwiz/nativescript-stripe) with Angular. When i get the data dynamically from the frontend, the card number and the cvv are fine, but the expiring month and year are failing the card validation process. When I replace the dynamic month and year data with hardcoded values everything works great. Here is my code:


     import { Component, OnInit, ViewChild, ElementRef } from 
    "@angular/core";
     import { Router } from '@angular/router';
     import {Page} from "ui/page";
     import {View} from "ui/core/view";
     import { CreditCardView, Card, Stripe } from 'nativescript-stripe';
     import { EventData } from 'data/observable';
  
    @Component({
     selector: "Payment",
     moduleId: module.id,
     templateUrl: "./payment.component.html"
    })
    export class PaymentComponent implements OnInit {
 
    @ViewChild("card") card: ElementRef;
      constructor(page: Page) {}
 
    ngOnInit(): void {
        // Init your component properties here.
    }
 
    submit(args: EventData): void {
        let cardView = <CreditCardView>this.card.nativeElement;
        let card = <Card>cardView.card.card;
        const stripe = new Stripe('...');
       
        stripe.createToken(card,(error,token)=>{
            if (!error) {
              console.log(token.getId());
              console.log(token.getCard());
            } else {
              console.log(error);
            }
          });
    }

HTML:

    <CreditCardView #card></CreditCardView>
    <Button text="Button" (tap)="submit($event)"></Button>

When I try to print the card properties, I get the right card number and cvv, but both card.expireMonth and card.expireYear are giving me a 10 digits number, not a 2 digits one. I’m not sure if i did something wrong, or this is a bug. I’ve tested only on Android.

Best regards,
Vlad


#2

Can you show us some code how exactly you are setting the values dynamically?


#3

I’m not setting them, they are setted by the plugin in the card variable with the user input.

submit(args: EventData): void {
		let cardView = <CreditCardView>this.card.nativeElement;
		let card = cardView.card;
		const stripe = new Stripe('...');
		
 		 const cc:Card = new Card(card.number, card.expMonth, card.expYear, card.cvc);
	         stripe.createToken(cc.card,(error,token)=>{
			   if (!error) {
				 console.log(token.getId());
				 console.log(token.getCard());
			   } else {
				 console.log(error);
			   }
			 });
		 }
	}

This is another way that I tried that I think shows the problem better. card.expMonth and card.expYear values are 10 digits numbers, while card.number and card.cvc are the ones from the user input. If i replace the month and year with hardcoded two digit values, everything works perfect.


#4

Can you try logging cardView.android.getExpMonth() / cardView.android.getExpYear() and let me know what it returns?


#5

TypeError: cardView.android.getExpMonth is not a function.


#6

It should be accessible, I’m not sure what could be the issue as it works on my end.


#7

I have this exact problem too and opened an issue on github.