angularjs - How to use angular directive inside a markdown that is converted via Showdown? -

i have markdown directive loads markdown file , displays html:

// detail.html

<div markdown link="{{post.file"}}"></div> 

this works fine, when have html tags in markdown files. trying use angularui bootstrap directives, tabs in particular, on markdown page.

those tabs have content specific each markdown file reason cannot place directive outside markdown file.

i figured out. have use $compile service. here complete code example:

angular.module('myapp')   .directive('markdown', function($http, $compile) {     var converter = new showdown.converter();     return {       link: function(scope, element, attrs) {         attrs.$observe('file', function(file) {           if (file) {             $http.get('posts/' + file).success(function(response) {               var htmltext = converter.makehtml(response);               element.html(htmltext);                $compile(element.contents())(scope);              });           }         });       }     }   });