在Ember / handlebars应用程序中显示JS脚本组件 [英] Show a JS script component in Ember/handlebars app

问题描述

我需要嵌入一个Javscript组件（例如，一个Stripe支付按钮 https://stripe.com/docs/checkout ）在我的烬应用程序，但显然我不能简单地把脚本标签内的车把脚本标签..任何建议如何做到这一点，请吗？

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 handlebar script tag.. any suggestion on how this can be done please?

推荐答案

创建视图并在didInsertElement挂接中添加脚本。

这是一个演示。

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}}

这篇关于在Ember / handlebars应用程序中显示JS脚本组件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！