Angular provider for easy interaction with Stripe.js. angular-stripe wraps Stripe.js's async operations in $q
promises, making response handling easier and eliminating $scope.$apply
calls and other repetitive boilerplate in your application. Check out angular-credit-cards for validating your credit card forms.
npm install --save angular-stripe
angular-stripe will load Stripe.js when it's first called. You don't need to directly include Stripe.js via a <script>
tag.
// node module exports the string 'angular-stripe' for convenience
angular.module('myApp', [
require('angular-stripe')
])
// otherwise, include the code first then the module name
angular.module('myApp', [
'angular-stripe'
])
angular-stripe exposes stripeProvider
for configuring Stripe.js.
The URL that will be used to fetch the Stripe.js library.
Sets your Stripe publishable key.
angular
.module('myApp', [
'angular-stripe'
])
.config(function (stripeProvider) {
stripeProvider.setPublishableKey('my_key')
})
Inject stripe
into your services or controllers to access the API methods. createToken
returns a $q
promise. If Stripe responds with an error, the promise will be rejected.
Same as stripeProvider.setPublishableKey
Tokenizes a card using Stripe.card.createToken
. You can optionally pass a key
property under params
to use a different publishable key than the default to create that token. This is especially useful for applications using Stripe Connect.
The following utility methods are also exposed:
Tokenizes a card using Stripe.bankAccount.createToken
.
The following utility methods are also exposed:
Creates a bitcoin receiver using Stripe.bitcoinReceiver.createReceiver
.
Polls a bitcoin receiver using Stripe.bitcoinReceiver.pollReceiver
. Note that you'll need to implement additional logic if you need to cancel receivers.
The following utility methods are also exposed:
app.controller('PaymentController', function ($scope, $http, stripe) {
$scope.charge = function charge () {
return stripe.card.createToken($scope.payment.card)
.then(function (response) {
console.log('token created for card ending in ', response.card.last4)
var payment = angular.copy($scope.payment)
payment.card = undefined
payment.token = response.id
return $http.post('https://yourserver.com/payments', payment)
})
.then(function (payment) {
console.log('successfully submitted payment for $', payment.amount)
})
.catch(function (err) {
if (err.type && /^Stripe/.test(err.type)) {
console.log('Stripe error: ', err.message)
}
else {
console.log('Other error occurred, possibly with your API', err.message)
}
})
}
})