Creating dynamic html elements in angularjs
<p>I am trying to create some dynamic html elements in angular based on values I have stored in a SQL database.  This is a prize selection application for work where I have 5 prizes which have descriptions associated and each description has a type (span, p, div, h1, etc).  So based on what our DB says the line should be i want the html to create itself.  The way the data is laid out is I have a data object that has an array of pictures and each picture object has an array of description objects { Pictures[ Descriptions[] ] }</p>

<blockquote>
  <p>"Pictures":[{"ID":9,"IDName":"messengerBag","Descriptions":[{"ID":7,"Text":"Messenger bag is a perfect size for most 15” laptops.  The 10th anniversary logo is beautifully displayed in full detail on the front pocket.","DescriptionType":"h3"},{"ID":8,"Text":"Zippered main compartment includes a padded laptop sleeve.","DescriptionType":"p"},{"ID":9,"Text":"Velcro front pocket with organization panel.","DescriptionType":"p"}, {"ID":10,"Text":"Pen loop and side mesh pocket.","DescriptionType":"p"},{"ID":11,"Text":"Adjustable shoulder strap and two carry handles.","DescriptionType":"ul"},...</p>
</blockquote>

<p>I have tried using the values directly and it did not work:</p>

<pre><code>&lt;div ng-repeat="pic2 in vm.data.Pictures" ng-show="{{$index}} == vm.index"&gt;
    &lt;{{desc.DescriptionType}} ng-repeat="desc in pic2.Descriptions"&gt;{{desc.Text}}&lt;/{{desc.DescriptionType}}&gt;
&lt;/div&gt;
</code></pre>

<p>I then decided to try a directive.  I could get it to return the text but never the element with the description type i was hoping for.</p>

<pre><code>.directive("dynamicelement", ['$compile', function ($compile) {
    return {
        restrict: "E",
        scope: { desc: '@' },
        template: '&lt;' + '{{header}}' + '&gt;' + '{{header2}}' + '&lt;/' + '{{header}}' + '&gt;',
        controller: function ($scope) {
            $scope.header = "p";
            $scope.header2 = "hi";
        }
    }
};
</code></pre>

<p>I have read article where they talked about using $compile and needing a link function in my directive but i'm not really sure how to use those.</p>

<p>I also have an example of using ngSwitch from <a href="https://stackoverflow.com/questions/15296949/how-can-i-use-angular-to-output-dynamic-form-fields">How can I use Angular to output dynamic form fields?</a> but this didn't seem to lend itself to my dual ng-repeat organization I am currently using.</p>

<p>Is what I am trying to accomplish possible and if so anyone have pointers on what I should be looking at?  Thanks for your time.</p>