1

I am having trouble getting transcluded content to render properly in my custom directives.

Here are examples:

http://plnkr.co/edit/mvx5GuMrPcUPJbrOCKbD

The content coming from the external source has newline (\n) characters, and I want to use a filter to replace the newlines with <br> HTML tags.

app.filter('newline2br_trust', ['$sce',
    function($sce) {
        return function(input) {
          return input ? $sce.trustAsHtml(input.replace(/\n/g, '\n<br/>')) : '';
        };
    }
]);

This seems to work correctly if I use ng-bind-html on a single element, but if I have a custom directive with transcluded contents, it seems to ignore the $sce.trustAsHtml(), and escapes the HTML content:

<multiline>{{ example.data1 | newline2br_trust }}</multiline>

How can I get my directive to properly transclude this HTML content?

NOTE: It seems to be something with the $sce functionality with AngularJS expressions + ngTransclude, as raw/static HTML content works properly with transclude:

<multiline>BrLine1<br/>BrLine2<br/>BrLine3</multiline>
thaMANSTA
  • 51
  • 3
  • Try using `` – Chris Nov 02 '15 at 21:23
  • Yes, if you take a look at the plunkr, `ng-bind-html` works, except I want this directive to work with ALL transcluded content. The `
    ` tags work if the raw HTML is transcluded, but not if the HTML comes from an expression, even if that expression ends with a filter that outputs `$sce.trustAsHtml` content.
    – thaMANSTA Nov 02 '15 at 21:52
  • Anything here help you at all? http://stackoverflow.com/questions/18340872/how-do-you-use-sce-trustashtmlstring-to-replicate-ng-bind-html-unsafe-in-angu/18342738#18342738 – Chris Nov 02 '15 at 21:55
  • Unfortunately no, I'm looking for a solution using ngTransclude. – thaMANSTA Nov 02 '15 at 23:50
  • @thaMANSTA did you ever solve this? – pilau Jan 09 '18 at 15:29

0 Answers0