polymer-2.xdom-repeat

How to Call Function on Each dom-repeat Element


I am trying to call a function on each element inside of a dom-repeat template.

<dom-repeat items="[[cart]]" as="entry">
  <template>
    <shop-cart-item id="item"></shop-cart-item>
  </template>
</dom-repeat>

...

checkStatus() {
  this.$.item.doSomething();
}

How can I call doSomething on each element?


Solution

  • You can iterate through nodes like:

    checkStatus() {
      const forEach = f => x => Array.prototype.forEach.call(x, f);
    
      forEach((item) => {
        if(item.id == 'cartItem') {
          console.log(item);
          item.doSomething(); // call function on item
        }
      })(this.$.cartItems.childNodes)
    }