2014-08-31 114 views
1

我有一個聚合物元素,它需要從Web服務加載一些數據。使用一個類作爲飛鏢聚合物元素的屬性

<gallery-pol loader=""></gallery-pol> 

@CustomTag('gallery-pol') 
class PolymerGallery extends PolymerElement { 
    @published GalleryDataLoader loader; 
    ... 
} 

我不想在我的聚合物元素中實現數據加載,因爲它不應該固定到特定的Web服務。

傳遞一個實現實際數據加載到我的聚合物元素的對象的最佳方法是什麼?

我應該只是在主程序中選擇我的元素,並將加載器分配給元素? 還是有一些扼殺方式直接將其作爲屬性傳遞?

謝謝 lolsharp

+0

沒有問題,您可以使用'loader'屬性指定一個加載器。從哪裏或如何通過裝載機?你想通過代碼'(querySelector('gallery-pol')作爲PolymerGallery來實現).loader = loader;'?或者你有''' '元素在陰影DOM中?你在哪裏定義應該使用哪個loader實現? – 2014-08-31 16:34:56

+0

我發佈了一個例子http://stackoverflow.com/questions/24964885 – 2014-08-31 16:39:01

回答

2

我會考慮太多造型裝載機作爲自定義元素。從那裏你有幾個選擇他們如何溝通。

之一是讓庫中找到裝載機作爲一個孩子:

<z-gallery> 
    <z-gallery-loader></z-gallery-loader> 
</z-gallery> 

元素也可以通過查詢/ IDS發現對方或結合:

<z-gallery-view> 
    <z-gallery-loader id="loader"></z-gallery-loader> 
    <z-gallery loader="{{ $['loader'] }}"></z-gallery> 
</z-gallery-view> 

$[]中的上下文<z-gallery-view>聚合物元素按id查找內容。你也可以自己綁定到一個ID字符串,然後執行查詢:

<z-gallery-view> 
    <z-gallery-loader id="loader"></z-gallery-loader> 
    <z-gallery loader="loader"></z-gallery> 
</z-gallery-view> 

一種不同的方法是通過事件進行溝通:

<z-gallery-loader on-load-gallery="{{ loadGallery }}"> 
    <z-gallery></z-gallery> 
</z-gallery-loader> 

<z-gallery>可以發射「負載庫」(或者一些更以用戶操作爲中心的事件)自定義事件來請求要加載的數據,並且由於它被包含爲事件的目標,加載器可以完成它的工作並將數據推送回庫中。

如果你不想有包含關係,可以通過具有觸發對裝載機的事件不同的父元素重定向事件:

<z-gallery-view on-load-gallery="{{ loadGallery }}"> 
    <z-gallery-loader></z-gallery-loader> 
    <z-gallery></z-gallery> 
</z-gallery-view> 

如果在這種情況下loadGallery委託給裝載機孩子。

相關問題