Polymer：コンフィグレーションファイルにREST APIのベースURLを格納する方法

Question

私はポリマースターターキットを使用しています。さまざまなHTMLページで多くのAPI呼び出しを行い、API呼び出しごとに "iron-ajax"を使用しています'url'プロパティのために私はREST API URLを割り当てています。

URLは "https://XXXXX.in/YY/YY/YY"のようになります。ここで、ベースURL XXXXXはすべてのAPI呼び出しで同じで、YYが変更されます。ベースURL XXXを1つの設定ファイルに保存して、鉄アヤックス "？私はベースURLにアクセスする必要があります、それはすべてのページのポリマーの「準備完了」機能の中にありますか？

Answer 1

オプション1

ポリマーには値をプロパティとして保存します。最初の親要素のノードツリーの上にプロパティとしてベースURLがある場合は、それを任意の子要素に渡すことができます（そして、それをさらに下に渡すことができます）。

あなたの先頭の要素：

<link rel="import" href="./child-el.html"> 
<dom-module id="main-el"> 
    <template> 
     <child-el base-url="[[baseUrl]]"></child-el> 
    </template> 
</dom-module> 
<script> 
    Polymer({ 
     is: 'main-el', 
     properties: { 
      baseUrl: { 
       type: String, 
       value: 'https://XXXXX.in' 
      } 
     } 
    }); 
</script> 

子：

<dom-module id="child-el"> 
    <template> 
     <iron-ajax url="[[baseUrl]]/YY/YY/YY"></iron-ajax> 
    </template> 
</dom-module> 
<script> 
    Polymer({ 
     is: 'child-el', 
     properties: { 
      baseUrl: { 
       type: String 
      } 
     } 
    }); 
</script> 

OPTION 2

あなたが画面上には何もレンダリングされません一つの要素内のすべてのAJAX呼び出しを置くことができますし、必要な場所にその要素を含めます。

<link rel="import" href="./api-handler.html"> 
<dom-module id="main-el"> 
    <template> 
     <api-handler id="api-handler"></api-handler> 
    </template> 
</dom-module> 
<script> 
    Polymer({ 
     is: 'main-el', 
     attached() { 
      this.$['api-handler'].makeRequest(); 
     } 
    }); 
</script> 

OPTION 3

ストアはbaseUrlにポリマーbehavior内のプロパティとは、その中にあなたの要素を含みます。あなたがグローバルにアクセス可能なウィンドウオブジェクトに値を添付することができ

OPTION 4

。そして、あなたはindex.htmlの中にいることをインポート

<script> 
    (function (Config) { 
     Config.BASE_URL = 'https://XXXXX.in'; 
    })(window.Config = window.Config || {}); 
</script> 

：あなたのconfig.htmlは次のようになり

<link rel="import" href="./config.html"> 

Config.BASE_URLは、すべての要素で利用できるようになります..and。