2017-05-02 16 views
0

これに関する良い文書は見つかりませんでした。API 2を角度2指令に追加していますか?

私はサードパーティのライブラリ/ apiを持っていましたが、私はそれを角度2のディレクティブに実装したいと考えていました。どうすればいい?

次のことを考える:

<script src="https://cdn.plaid.com/link/v2/stable/link-initialize.js"></script> 

    <script> 
     var linkHandler = Plaid.create({ 
     env: 'sandbox', 
     clientName: 'Plaid Sandbox', 
     // Replace '<PUBLIC_KEY>' with your own `public_key` 
     key: '#####', 
     product: ['auth'], 
     onSuccess: function(public_token, metadata) { 
     // Send the public_token to your app server here. 
     // The metadata object contains info about the 
     // institution the user selected and the 
     // account_id, if selectAccount is enabled. 
      console.log("Token: " + public_token + " Metadata: " + metadata); 
     }, 
     onExit: function(err, metadata) { 
     // The user exited the Link flow. 
     if (err != null) { 
     console.log("Error: " + err); 
     } 
     // metadata contains information about the 
     // institution that the user selected and the 
     // most recent API request IDs. Storing this 
     // information can be helpful for support. 
     } 
     }); 
     // Trigger the standard institution select view 
     document.getElementById('link-button').onclick = function() { 
     linkHandler.open(); 
     }; 

答えて

0

はあなたのインデックスや、あなたのスクリプトのセクションでは、角度-CLIを使用している場合は、外部APIのスクリプトをインポートします。

リンクinitialize.directive.ts

import {Directive} from '@angular/core'; 

declare const Plaid: any; 

@Directive({ 
    selector: '[linkInitialize]' 
}) 

export class LinkInitializeDirective { 
    linkHandler: any; 

    constructor() { 
    this.linkHandler = Plaid.create({ 
     env: 'sandbox', 
     clientName: 'Plaid Sandbox', 
     // Replace '<PUBLIC_KEY>' with your own `public_key` 
     key: '#####', 
     product: ['auth'], 
     onSuccess: function(public_token, metadata) { 
     // Send the public_token to your app server here. 
     // The metadata object contains info about the 
     // institution the user selected and the 
     // account_id, if selectAccount is enabled. 
      console.log("Token: " + public_token + " Metadata: " + metadata); 
     }, 
     onExit: function(err, metadata) { 
     // The user exited the Link flow. 
     if (err != null) { 
      console.log("Error: " + err); 
     } 
     // metadata contains information about the 
     // institution that the user selected and the 
     // most recent API request IDs. Storing this 
     // information can be helpful for support. 
     } 
     }); 

     // Trigger the standard institution select view 
     document.getElementById('link-button').onclick = function() { 
     linkHandler.open(); 
     }; 
    } 
} 

そしておそらく、this questionポイントあなたの右方向:次に、この(コードがテストされていない)のようなディレクティブを作成します。

+0

ありがとうございます!だからコンポーネントのコンストラクタ()の下でこれをスローすることも可能ですが、正しいのでしょうか? – QueSo

+0

もちろん、私は見ることができますが、テンプレートを必要としないことを理解しているので、より良い指示になります(コンポーネントを使用する主な理由です)。 – Ismaestro

+1

それはうまくいった。私はもっ​​と多くの担当者を持っていればあなたをアップアップするだろう;-) – QueSo

関連する問題