AngularJS ng-bind-html and components

Question

I'm using AngularJS ver. 1.6.8.

I have a component I have built called icons. To incorporate it in a page I just add <icons></icons> and the component is inserted into the page.

Now I have a scope variable that holds html, and part of that html is the previously mentioned code <icons></icons> .

When I use ng-bind-html it doesn't compile the component and instead just shows <icons></icons> as text.

I have tried using angular-bind-html-compile ( link ) but that didn't help.

All of the solutions I found seem to support angular pre made directives and not newly formed components.

Happy to hear of any possible solutions.

Answer 1

Did you do the following on your scope variable which holds the html code? This is a common mistake.

$scope.trustAsHtml('<div>....')

But as mentioned before, without your code it is hard to figure out the problem.