JavaScriptをAngular2でレンダリングする

Question

私は新しく、paypalを設定しようとしています。これは私が使いたいjavascriptです。

https://developer.paypal.com/demo/checkout/#/pattern/client

私はHTMLにスクリプト本体をコピー＆ペーストすると、何もアップしていません。

私はNG-onit機能でスクリプトを入れてみましたが、私はそれを行う方法を本当にわからないんだけど...

component.js

ngOnInit = function() 
    { 
    paypal.Button.render({ 

     ... 

HTML

<script src="https://www.paypalobjects.com/api/checkout.js"></script> 
div id="paypal-button-container"></div 

私は、スクリプト参照をcomponent.jsのどこかに置いていますか？あなたはscriptとしてHTMLページではJavaScriptを含む場合ここで

おかげ

Answer 1

はあなたが単にimportもの（この場合はペイパルAPI）することはできませんPlunker

を進めています。しかし、これを行うと、ブラウザがページが読み込まれるときにそのスクリプトをロードします。ドキュメントの例によると、スクリプトがロードされた後、グローバルpaypalオブジェクトが利用可能になると言われています。角度によって管理される前、または使用できないグローバルオブジェクトを使用するには、我々は好きで、それをハックすることができます

declare var paypal: any; 

次にあなたが、写しでそれを使用することができます。このサードパーティ製のスクリプトはrenderingの一部を実行するので、その初期化をライフサイクルフックngAfterViewInitに入れておくことをお勧めします。

Answer 2

私は

<form #form class="form-inline" name="_xclick" 
action="https://www.paypal.com/cgi-bin/webscr" method="post"> 
<input type="hidden" name="cmd" value="_xclick"> 
<input type="hidden" name="business" value="mmusale93@gmail.com"> 
<input type="hidden" name="currency_code" value="USD"> 
<input type="hidden" name="item_name" value="Paypal demo charge"> 
<input name="item_number" type="hidden" value="0001"/> 
<input type="text" class="form-control" size="30" id="paypalAmount" name="amount"/> 
<input type="hidden" name="return" value="https://localhost:4200/" /> 
<input type="hidden" name="cancel_return" value="https://localhost:4200/" /> 
<input type="hidden" name="custom" value={{title}}> 
<!--pass your notification URL--> 
<input name="notify_url" value="YOUR NOTIFICATION URL" type="hidden"><br/> 
<br/> 
<input (click)="form.submit()" type="image" 
src="https://www.paypal.com/en_US/i/btn/btn_buynow_LG.gif" border="0" 
      name="submit" alt="Make payments with PayPal - it's fast, free 
and secure!"/> 
</form> 

（angular2 https://github.com/musale/angular2-paypalでペイパル）...別のアプローチを使用することにしましたこれは、PayPalのボタンを作り、すべてはそれが簡単に動的な要素です。