Angularjs attribute with html content

Question

I want to have html content in my attribute to style the output, with lists and strong words etc.

angular.module('calc.popover', [])
  .directive('popover', function() {
    return {
        restrict: 'E',
        templateUrl: '/partials/popover.tpl.html',
        scope: {
            title: '@',
            content: '@'
          
          }
      
      }
  
  };

 <popover title="I am a popover" content="Many Text <br> New line. <ul><li> a list </li></ul>"></popover>

How can i do this? If i do this, the output shows me the html tags.

Answer 1

You need to use 'ngTransclude' property to get html template content in directive, and pass content to directive like this: <popover title="I am a popover"><br> New line. <ul><li> a list </li></ul>"></popover> For working Example check: http://plnkr.co/edit/5RKBZRBmEH6PMvmbZomt?p=preview