在Polymer 1.0中訪問來自子（或深子子元素）元素的BASE API URL

我在Polymer 1.0環境中創建了許多元素。一些元素是基於我使用iron-ajax從我的數據庫服務器獲得的數據的列表。目前，我正在使用我的根應用程序將API URL作爲元素屬性傳遞給每個需要它的元素（或子元素），以便它可以進行調用並顯示結果。在Polymer 1.0中訪問來自子（或深子子元素）元素的BASE API URL

雖然有些東西感覺不到。我應該將AJAX URL從根元素傳遞給需要它的子元素，還是讓子元素知道全局設置的應用程序API URL是什麼？

來源

2015-09-14 Sean

我有同樣的問題，幸好

有針對:)元素

所以我創建了一個自定義元素來包裝我所有的iron-ajax元素在我的應用程序，稱它爲my-app-api。

這my-app-api元素負責更新嵌套iron-ajax url屬性。

<dom-module id="my-app-api"> 
    <style> 
    :host { 
     display: none; 
    } 
    </style> 
    <template> 
    <content select="iron-ajax"></content> 
    </template> 
</dom-module> 
<script> 
(function() { 
    Polymer({ 
    is: 'my-app-api', 

    properties: { 
     baseUrl: { 
     type: String, 
     value: 'http://localhost:9000' 
     } 
    }, 
    attached: function() { 
     this.updateUrlsAndSign(); 
    }, 
    updateUrlsAndSign: function() { 

     var ajaxElements = Polymer.dom(this).querySelectorAll('iron-ajax'); 

     var ajaxElementsArray = [].slice.call(ajaxElements); 

     ajaxElementsArray.forEach(function(ajax) { 

     var urlAttr = ajax.getAttribute('url'); 

     if (!urlAttr) { return; } 

     ajax.url = this.baseUrl + urlAttr.replace(window.location.origin, ''); 

     ajax.headers = ajax.headers || {}; 

     ajax.headers['Content-Type'] = 'application/json'; 

     ... 

     }.bind(this)); 
    } 
    }); 
})(); 
</script>

示例用法，

<my-app-api> 
<iron-ajax 
    url="/api/videos/" 
    params="{{requestParams}}" 
    handle-as="json" 
    on-response="handleResponse"></iron-ajax> 
</my-app-api>

我還沒有auto屬性上iron-ajax元件設置進行了測試。

在我的情況，因此上面的代碼工作得很好我，這不是一個問題。

希望這會幫助您實施更好的解決方案。

來源

2015-09-14 16:55:41

我做了類似的事情（包在我的API元素鐵），但我不喜歡硬編碼我的基本的API URL中的元素的想法。如果元素與使用不同端口的人共享，該怎麼辦？如果我做出口而傳遞給我的包裝參數那麼我傳遞一個端口帕爾馬每一個元素和子包裝 - 這看起來不正確要麼... – Sean

一個其他更質疑，@Mohammad：如何處理請求頭的會話令牌和用戶ID更新？你是否每次都將它們傳遞給iron-ajax元素？ – Sean

@Sean肯定，這是'updateUrlsAndSign（）'函數的其餘部分 –

在Polymer 1.0中訪問來自子（或深子子元素）元素的BASE API URL

回答

相關問題