Skip to content Skip to sidebar Skip to footer

Show A Js Script Component In Ember/handlebars App

I need to embed a Javscript component (e.g. a Stripe pay button https://stripe.com/docs/checkout ) in my ember app, but apparently I can’t simply put a script tag inside the hand

Solution 1:

Create a view and add the script in the didInsertElement hook.
Here is a working demo.

App.StripeView = Em.View.extend({
  didInsertElement: function() {
    var stripeScript = 
      '<script src="https://checkout.stripe.com/checkout.js" '+
        'class="stripe-button" data-key="pk_test_6pRNASCoBOKtIshFeQd4XMUh" '+
        'data-image="/square-image.png" '+
        'data-name="Demo Site" '+
        'data-description="2 widgets ($20.00)" '+
        'data-amount="2000">'+
      '</script>';

    this.$().append(stripeScript);
  }
});

And use it in your template like

{{view App.StripeView}}

Post a Comment for "Show A Js Script Component In Ember/handlebars App"