如何在angular 2組件html模板中添加腳本標簽

Question

我正在將razorpay付款結帳表格集成到使用Angular 2+的MEAN Stack應用程序中。

參考： https : //docs.razorpay.com/docs/checkout-form

根據他們的文檔，我需要將以下腳本標記添加到html頁面中。

當我在angular 2的index.html頁面中添加以下腳本時，所有腳本都可以正常運行，但自然會在所有頁面中顯示。

<script
    src="https://checkout.razorpay.com/v1/checkout.js"
    data-key="rzp_test_1dfsgdhsreQvD"
    data-amount="5000"
    data-buttontext="Pay with Razorpay"
    data-name="Compy name"
    data-description="Test Transaction with Razor Pay"
    data-image="./assets/static/hmicon.png"
    data-prefill.name="Test"
    data-prefill.email="test@gmail.com"
    data-theme.color="#F37254">
</script>
<input type="hidden" value="Hidden Element" name="hidden">

如何在特定組件模板html文件中添加上述腳本？

到目前為止，在我的html模板中，我只有

<div class="container fixContainer">
    ...
    ...  <!--There is no html or body tag used here-->

    <div *ngIf="showButton" class="col-md-8 col-sm-8 col-xs-8">             
            <!--I tried to include the above script here, but nothing shows up-->
            ...

            ...

    </div>
</div>

或者，如果不在html中，如何在我的組件ts文件中包含？

Answer 1

在angular 2組件中， HTML模板完全受限制