是否可以在Polymer中的<content>节点上使用自定义属性来获得漂亮的API？</content>

Question

我如何实现自定义元素API，如：

<swiper-slider>
  <slide background="http://lorempixel.com/output/people-q-c-640-480-9.jpg"></slide>
  <slide>JUST TEXT!</slide>
</swiper-slider>

在聚合物中？我似乎无法弄清楚如何使用JavaScript检查background节点上是否已设置slide或如何使用该属性。

我得到的最接近的是data-background="..." nodes[ i ].dataset.background，其中节点为nodes = this.$.content.getDistributedNodes()。

任何见解都非常感谢，特别是如果判决结果是不可能的话！

Answer 1

只需遍历childNodes并检查元素：

...
ready: function() {
 for(var i = 0; i < this.childNodes.length; i++) {
  var element = this.childNodes[i];

  if(element.tagName == "SLIDE") {
   switch(true) {
    // Credit here goes to John Smith, btw!
    case element.hasAttribute("background"): 
     var background = element.getAttribute("background");
     break;

    default:
     break;
   }
  }
}
...