Support for Angular 11
bgpedersen opened this issue · comments
Hi @bgpedersen, This error is due to Chargebee.js trying to initialise before document.body
is loaded. You can do the following to solve this.
Add Chargebee Angular module in app.module.ts
:
import { ChargebeeJsAngularWrapperModule } from '@chargebee/chargebee-js-angular-wrapper';
...
@NgModule({
...
imports: [
...
ChargebeeJsAngularWrapperModule
],
...
})
Initialise Chargebee.js on constructor of your component: app.component.ts
export class AppComponent {
cardComponent = null;
...
constructor() {
window['Chargebee'].init({
site: 'your-site',
publishableKey: 'publishable-key'
})
}
onReady = (cardComponent) => {
this.cardComponent = cardComponent;
}
onTokenize = (event) => {
event.preventDefault();
this.cardComponent.tokenize().then(data => {
console.log('chargebee token', data.token)
});
}
}
app.component.html
<div cbCardField id='card-field' (ready)="onReady($event)"></div>
<button (click)="onTokenize($event)">Submit</button>
Also, @chargebee/chargebee-js-angular-wrapper
is still on Angular 10, however, there should not be any compatibility issues when using with the latest versions of angular.
We'll bump the angular peer dependencies to the latest version soon.
@bgpedersen is this issue still open? If not, please close.