title: How to dynamically add <p:tab> to <p:wizard> in a loop
body: <p>I would like to dynamically add <code>&lt;p:tab&gt;</code> components to <code>&lt;p:wizard&gt;</code> component in a loop.</p>
  
  <p>I tried using <code>&lt;ui:repeat&gt;</code> inside and outside <code>&lt;p:wizard&gt;</code> component. </p>
  
  <pre><code>&lt;p:wizard&gt;
      &lt;ui:repeat value="#{tabBean.tabs}" var="tab"&gt;
          &lt;p:tab title="#{tab.tabname}"&gt;
      &lt;/ui:repeat&gt;
  &lt;/p:wizard&gt;
  </code></pre>
  
  
  
  <pre><code>&lt;ui:repeat value="#{tabBean.tabs}" var="tab"&gt;
      &lt;p:wizard&gt;
          &lt;p:tab title="#{tab.tabname}"&gt;
      &lt;/p:wizard&gt;
  &lt;/ui:repeat&gt;
  </code></pre>
  
  <p>None of both attempts work. How can I achieve my requirement?</p>