title: Is there a way could I dynamically generate angular directives at runtime?
body: <p>I have this crazy idea, I'm building an app with different contents to show, and the contents' data is from the server with websocket, also the directives for showing the data.</p>
  
  <p>So I'm wondering if there is a way I could dynamically generate/register directives at runtime?</p>
  
  <p>Like, I put an directive like this:</p>
  
  <pre><code>&lt;content ng-repeat="d in data" &gt;&lt;/content&gt;
  </code></pre>
  
  <p>and then after I got the directive from the server, I could using something like this to register this:</p>
  
  <pre><code>angular.module('app').directive('content', function(){
      return {
          restrict: 'E',
          template: // some way to fetch the template
          ...
  }
  </code></pre>
  
  <p>And then if the user enter this view, angular will be loading the directive I just registered. </p>
  
  <p>Also, I've tried several ways, like </p>
  
  <pre><code>&lt;div ng-include="'some template'" ng-repeat="d in data"&gt;&lt;/div&gt;
  </code></pre>
  
  <p>that works if all you need to do is repeat some plain html. But not if you're trying to bind some data too.</p>