使用类作为dart聚合物元素的属性 [英] Use a class as attribute for a dart polymer element

问题描述

我有一个聚合物元素，需要从Web服务加载一些数据。

 < gallery-pol loader =>< / gallery-pol& 
 
 @CustomTag（'gallery-pol'）
类PolymerGallery扩展PolymerElement {
 @published GalleryDataLoader loader; 
 ... 
} 
  

我不想实现在我的聚合物元素中的数据加载，因为它不应该固定到特定的Web服务。

将实际数据加载到我的聚合物元素的对象的最佳传递方式是什么？

我应该在主程序中选择我的元素并将加载器分配给元素？

谢谢你，
lolsharp

div class =h2_lin>解决方案

我会考虑将加载器建模为自定义元素。

一个是让图库将装载器作为子级查找：

 < 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> Polymer元素按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> 'load-gallery'（或者更多的用户动作为中心的事件）自定义事件来请求数据被加载，并且由于它被包括作为事件的目标，加载器可以做它的工作，并将数据推回到库。

如果您不想在其中包含包含关系，可以通过具有触发加载器上的事件的不同父元素来重定向事件：

 < z-gallery-view on-load-gallery ={{loadGallery}} 
< z-gallery-loader>< / z-gallery-loader> 
< z-gallery>< / z-gallery> 
< / z-gallery-view> 
  
 
 
 
在这种情况下，loadGallery代表加载器子对象。
 
I have a polymer element, which needs to load some data from a web service. 
<gallery-pol loader=""></gallery-pol>

@CustomTag('gallery-pol')
class PolymerGallery extends PolymerElement {
  @published GalleryDataLoader loader;
  ...
}
I don't want to have implementation of the data loading in my polymer element as it shouldn't be fixed to a specific web service. 

What is the best way to pass an object which implements the actual data loading to my polymer element?

Should i just select my element in the main program and assign the loader the to element?
Or is there some smother way to directly pass it as an attribute?

Thank you,
lolsharp
解决方案
I would consider modeling the loader as a custom element too. From there you have a few options on how they communicate.

One is to let the gallery find the loader as a child:
<z-gallery>
  <z-gallery-loader></z-gallery-loader>
</z-gallery>
Elements can also find each other via queries/ids or binding:
<z-gallery-view>
  <z-gallery-loader id="loader"></z-gallery-loader>
  <z-gallery loader="{{ $['loader'] }}"></z-gallery>
</z-gallery-view>
$[] in the context of a <z-gallery-view> Polymer element finds content by id. You could also bind to an id string and do the query yourself:
<z-gallery-view>
  <z-gallery-loader id="loader"></z-gallery-loader>
  <z-gallery loader="loader"></z-gallery>
</z-gallery-view>
A different approach is to communicate via events:
<z-gallery-loader on-load-gallery="{{ loadGallery }}">
  <z-gallery></z-gallery>
</z-gallery-loader>
<z-gallery> can fire 'load-gallery' (or maybe some more user-action centric event) custom events to request data to be loaded, and since it's included as the target of the event, the loader can do it's work and push the data back to the gallery.

If you don't want the containment relationship there, you can redirect events by having a different parent element that triggers events on the loader:
<z-gallery-view on-load-gallery="{{ loadGallery }}">
  <z-gallery-loader></z-gallery-loader>
  <z-gallery></z-gallery>
</z-gallery-view>
Where in this case loadGallery delegates to the loader child.

                        
这篇关于使用类作为dart聚合物元素的属性的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！