title: how to dynamically add html content with AngularJs
body: <p>I want to dynamically add HTML content with <code>angularJs</code>, but getting and error:</p>
  
  <pre><code>"$compile is not defined"
  </code></pre>
  
  <p>What can be the reason?</p>
  
  <p>Code</p>
  
  <pre><code>&lt;td ng-repeat="user in users[0].yds" data-title="'Timeline'" sortable="timeline" style="text-align: center" &gt;
      &lt;div class="circle_dynamic"&gt;&lt;/div&gt;
  &lt;/td&gt;
  
  
  angular.module('elnApp')
    .controller('ProgramtableCtrl', function ($scope, $location, $filter, ngTableParams,    
       programTableService) {
          for(var i=0; i&lt;=$scope.users[0].projects.length; i++){
              for(var j=0; j&lt;$scope.users[0].projects[i].results.length; j++){
  
                  if($scope.users[0].projects[i].results[j] == 0){
  
                      $(".circle_dynamic").html(
                        $compile(
                           ""
                        )(scope)
                      );
                      console.log('rm')
                  }else{
  
                      $(".circle_dynamic").html(
                        $compile(
                           "&lt;i ng-class='circle_class' style='position: absolute;'&gt;&lt;/i&gt;"
                        )(scope)
                      );
                      console.log('add')
                  }
              }
  
          }
  
      }, true);
  
  }});
  </code></pre>
  
  <p>how to add html content dynamically?  please help</p>