title: Accessing array inside of another array to use v-for
body: <p>I have an <code>array - 'items'</code> of <code>objects</code> and each of them contains an <code>array</code> of more <code>objects</code>.
  I would like to <code>access</code> the second array <code>'productPrices'</code> to use <code>v-for</code>. But <code>items.productPrices</code> doesn't work for me. Should I create double loop somehow?</p>
  
  <p>HTML:</p>
  
  <pre><code>  &lt;table&gt;
      &lt;tbody&gt;
        &lt;tr v-for="(element, index) in items.productPrices"&gt;
          &lt;td&gt;{{ element.name }}&lt;/td&gt;
          &lt;td&gt;
            &lt;span&gt;{{ element.amount }}&lt;/span&gt;
          &lt;/td&gt;
          &lt;td&gt;
            {{ element.price }}
          &lt;/td&gt;
        &lt;/tr&gt;
      &lt;/tbody&gt;
    &lt;/table&gt;
  </code></pre>
  
  <p>JS: </p>
  
  <pre><code>new Vue({
    el: "#app",
    data: {
      items: [
        { 
          name: 'menu', 
          path: 'menu', 
          productPrices: [
            { amount: 100, price: 80.61, name: 'first' },
            { amount: 250, price: 72.10 },
            { amount: 500, price: 79.62 },
            { amount: 1000, price: 100.20 },
            { amount: 2500, price: 147.60 },
            { amount: 5000, price: 232.56 }
          ], 
          quantity: 0 
        },
        { 
          name: 'Etui', 
          path: 'etui', 
          productPrices: [
            { amount: 100, price: 80.61, name: 'first' },
            { amount: 250, price: 72.10 },
            { amount: 500, price: 79.62 },
            { amount: 1000, price: 100.20 },
            { amount: 2500, price: 147.60 },
            { amount: 5000, price: 232.56 }
          ],
          quantity: 0 
        },
      ]
    }
  })
  </code></pre>
  
  <p>Here is a <a href="http://jsfiddle.net/khz30amb/" rel="nofollow noreferrer">fiddle</a>.</p>