title: Generate radio button dynamically inside angular ,based on data
body: <p>I have a scenario where I'm trying to show radio buttons say one question has two answers as 1) Veg 2)Non-veg ,so when i select veg it has further three options and the third option &quot;Mixture of Vegetable and Fruits&quot; has further question inside it and so on.</p>
  <p>The following is the reference json that I'm using</p>
  <pre><code>&quot;choices&quot;: {
        &quot;1&quot;: {
          &quot;text&quot;: &quot;Vegeterian&quot;,
          &quot;questions&quot;: {
            &quot;1&quot;: { 
              &quot;choices&quot;: {
                &quot;1&quot;: { &quot;text&quot;: &quot;Only Veggies&quot; },
                &quot;2&quot;: { &quot;text&quot;: &quot;Only Fruits&quot; },
                &quot;3&quot;: {
                  &quot;text&quot;: &quot;Mixture of Vegetable and Fruits&quot;,
                  &quot;questions&quot;: {
                    &quot;1&quot;: {
                      &quot;type_name&quot;: &quot;selectOne&quot;,
                      &quot;choices&quot;: {
                        &quot;1&quot;: {
                          &quot;text&quot;: &quot;Yes.. No animal product&quot;,
                          &quot;questions&quot;: {
                            &quot;1&quot;: {
                              &quot;type_name&quot;: &quot;selectOneOrMore&quot;,
                              &quot;choices&quot;: {
                                &quot;1&quot;: {
                                  &quot;text&quot;: &quot;You are a nice human being&quot;
                                },
                                &quot;2&quot;: {
                                  &quot;text&quot;: &quot;You are a good human being&quot;
                                }
                              }
                            }
                          }
                        },
                        &quot;2&quot;: {
                          &quot;text&quot;: &quot;No meat. but other animal product&quot;
                        }
                      }
                    }
                  }
                }
              }
            }
          }
        },
        &quot;2&quot;: { &quot;text&quot;: &quot;Non-Vegeterian&quot;}
      }
  </code></pre>
  <p>and on the angular front I have just shown the outer two option ,how can i dynamically on selection of the radio button add further question if it has further questions and option</p>
  <pre><code>    &lt;ng-container *ngFor=&quot;let consult of choices | keyvalue; let j = index; trackBy: trackByFn;&quot;&gt;
                &lt;td&gt;
                     &lt;input  type=&quot;radio&quot; name=&quot;radio&quot; id=&quot;radio-{{j}}&quot; /&gt;
                     &lt;label class=&quot;sr-text&quot; for=&quot;radio-{{j}}&quot;&gt;{{consult.value.text}}&lt;/label&gt;
                &lt;/td&gt;
     &lt;/ng-container&gt;
  </code></pre>