ngx-stripe-checkout
v1.0.3
Published
With ngx-stripe-checkout you can integrate stripe checkout in angular.
Downloads
22
Maintainers
Readme
With ngx-stripe-checkout you can integrate stripe checkout in angular.
Features
- Lazy loading
- Angular 4 and above
Getting Started
Install with NPM:
$ npm i ngx-stripe-checkout --save
Stripe configurations:
Configure your stripe account for integrating checkout.
https://stripe.com/docs/payments/checkout
Import into your project:
// Module
import { StripeCheckout, StripeModule } from 'ngx-stripe-checkout';
@NgModule({
declarations: [
],
imports: [
StripeModule
],
providers: [
StripeCheckout
],
bootstrap: []
})
Import and initialize stripe in your component:
// Component
import { StripeCheckout, OnetimeCheckoutOptions, RecurringCheckoutOptions } from 'ngx-stripe-checkout';
constructor(public stripe: StripeCheckout) {
this.stripe.initializeStripe(`your stripe key`)
.then((res) => console.log(res)) // Stripe Initialized
.catch((err) => console.log(err)); // Error message
}
// For Recurring Payments
// Invoke this function on button click
openSubscriptionCheckout() {
var checkoutOptions: RecurringCheckoutOptions = {
items: [{
plan: 'your plan id',
quantity: 'quantity'
}],
successUrl: 'https://example.com/payment/success',
cancelUrl: 'https://example.com/payment/failure'
}
this.stripe.openRecurringCheckout(checkoutOptions);
}
// For One time Payments
// Invoke this function on button click
var checkoutOptions: OnetimeCheckoutOptions = {
items: [{
sku: 'your sku id',
quantity: 'quantity'
}],
successUrl: 'https://example.com/payment/success',
cancelUrl: 'https://example.com/payment/failure'
submitType: 'donate',
billingAddressCollection: 'required'
}
this.stripe.openOnetimeCheckout(checkoutOptions);
}