title: How to set the data of WinJS.UI.Repeater control in JS code?
body: <p>I'm developing a Windows Store Application using JavaScript.</p>
  
  <p>How to set the data of WinJS.UI.Repeater control in JS code? It's a very easy question but I don't know how to do.
  This is my HTML:</p>
  
  <pre><code>&lt;div id="imgRepeater" data-win-control="WinJS.UI.Repeater"&gt;
     &lt;img data-win-bind="src: src" /&gt;
  &lt;/div&gt; 
  </code></pre>
  
  <p>This is my JS code:</p>
  
  <pre><code>WinJS.UI.Pages.define("/pages/itemDetail/itemDetail.html", {
      ready: function (element, options) {
          var imgSrcArr = 
          [
             { src: '/img/a.jpg' }
          ];            
          var imgRepeater = element.querySelector("#imgRepeater");            
          imgRepeater.data = new WinJS.Binding.List(imgSrcArr);
      }
  });
  </code></pre>
  
  <p>However, no item shows in the repeater div. </p>
  
  <p>What's wrong with the code?</p>
  
  <p>BTW: I don't like the following code:</p>
  
  <pre><code>&lt;div data-win-control="WinJS.UI.Repeater" data-win-options="{data: Data.items}"&gt; 
  </code></pre>
  
  <p>It seems to use a global variable 'Data.items'.</p>