<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>dom-repeat4</title>
  <script src="../bower_components/webcomponentsjs/webcomponents.js"></script>
  <link rel="import" href="../host-element2.html">
  <link rel="import" href="../item-element2.html">
</head>
<body>
<div>
  <a href="../index.html">Back</a>
</div>
<template is="dom-bind">
  <!--setup model-->
  <host-element2 items="{{itemElements}}">
    <item-element2 item-id="1" values='[1]'></item-element2>
    <item-element2 item-id="2" values='[2]'></item-element2>
  </host-element2>

  <button on-tap="_reRender">Re-Render</button>

  <!--create view-->
  <h2>itemElements</h2>
  <template is="dom-repeat" items="{{itemElements}}">
    <div>
      <h3>itemId: <span>[[item.itemId]]</span></h3>
      <h3>Values: <span>[[item.values]]</span></h3>
      <h3>Values:</h3>
      <ul>
      <template is="dom-repeat" items="{{item.values}}" as="value">
        <li>[[value]]</li>
      </template>
      </ul>
    </div>
  </template>

</template>
<script>
  var demo = document.querySelector('template[is="dom-bind"]');
  demo._reRender = function(){
    var templates = document.querySelectorAll('template[is="dom-repeat"]');
    Array.prototype.slice.call(templates).forEach(function(t){t.render();});
  };
</script>
</body>
</html>
{'avg_line_length': 27.97872340425532, 'max_line_length': 78, 'alphanum_fraction': 0.6129277566539924, 'licenses': ['MIT'], 'repository_name': 'sandro-k/dom-repeat', 'path': 'demo/dom-repeat4.html', 'size': 1315, 'lang': 'HTML'}