Search code examples
angularjsng-bind-htmlng-bind

Links not working in ng-bind-html

I am using ng-bind-html but the links in the to binding html won't work.

This is the code for binding the content:

<div class="list-group-item-text" ng-class="article.img.length >0 ? 'col-md-10' : 'col-md-12'"
                 ng-bind-html="article.content | to_trusted">
</div>

This is how the link gets compiled Compiled link

the to_trusted filter looks like this:

.filter('to_trusted', ['$sce', function($sce){
        return function(text) {
            return $sce.trustAsHtml(text);
        };
}])

and still, when I click on the link nothing happens. Nothing in the console neither.

Ideas?

Edit: The input string:

It was never really finished and is actually in a state which is a result of playing around with jQuery and other tools. <a href="http://www.google.com" target="_blank">Google</a>

Edit2: I should say, the link works completely fine if I right-click it and then click "open in a new tab"

Solution

  • The answer is actually quite easy and embarassing.

    I had an <a> </a> wrapped around the container where the ng-bind-html got rendered. Changed it to a div. Obviously everything works now.