Render children in vue.js Components
<p>How can I get the option into select in vue.js. React has something like <code>this.props.children</code>, which I used for such cases. How can I solve this in vue.js?</p>

<p>I tried also to access the children with $children, but is was always an empty array.</p>

<p>In this example, the selectbox hasn't the option's.
Have added the example also on jsFiddle: <a href="https://jsfiddle.net/kt8urx7d/" rel="nofollow">https://jsfiddle.net/kt8urx7d/</a></p>

<p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-js lang-js prettyprint-override"><code>var FormComp = Vue.extend({
    template: '#form-comp'
});
Vue.component('form-comp', FormComp);

var SelectField = Vue.extend({
    template: '#select-field'
});
Vue.component('select-field', SelectField);

var SelectFieldOption = Vue.extend({
    template: '#select-field-option'
});
Vue.component('select-field-option', SelectFieldOption);


new Vue({
  el: '#container',
  template: '&lt;form-comp&gt;&lt;/form-comp&gt;'
});</code></pre>
<pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="https://cdnjs.cloudflare.com/ajax/libs/vue/1.0.26/vue.min.js"&gt;&lt;/script&gt;

&lt;script type="x/template" id="form-comp"&gt;
 &lt;form&gt;
   &lt;h1&gt;This is my Form&lt;/h1&gt;
   &lt;select-field name="my-select-field"&gt;
     &lt;select-field-option value="my-value-1"&gt;My Text 1&lt;/select-field-option&gt;
      &lt;select-field-option value="my-value-2"&gt;My Text 2&lt;/select-field-option&gt;
    &lt;/select-field&gt;
  &lt;/form&gt;
&lt;/script&gt;

&lt;script type="x/template" id="select-field"&gt;
 &lt;select name="{{ name }}"&gt;
   &lt;!-- include children: select-field-option --&gt;
  &lt;/select&gt;
&lt;/script&gt;

&lt;script type="x/template" id="select-field-option"&gt;
 &lt;option value="{{ value }}"&gt;{{ content }}&lt;/option&gt;
&lt;/script&gt;

&lt;div id="container"&gt;&lt;/div&gt;</code></pre>
</div>
</div>
</p>