Insert html into div with angular keeping ui-router ui-sref property working

Question

Here is my case:

I have a div which needs to get some html injected from a function:

<div ng-bind-html="myCtrl.getMyLink()"></div>

in my controller I have:

this.getMyLink = function () {
    return '<a ui-sref="app.go.to.state1">my link</a>';
}

It works but not at all. All I have at the end in my html is only

<a>my link</a>

It's a link but the ui-sref redirection is not working. There is surely something I'm missing.

How can I fix that?

http://stackoverflow.com/questions/24526801/difference-between-ui-sref-and-state-go-in-angularjs-ui-router — Hearner, Aug 26 '15 at 09:25

score 4 · Answer 1 · answered Aug 26 '15 at 09:26

4

ng-bind-html does not work with ui-sref directive. Just use href="path/to/state1" instead

answered Aug 26 '15 at 09:26

tombarti

score 2 · Accepted Answer · answered Aug 26 '15 at 09:26

The content inside ng-bind-html doesn't get compiled by angular, it is intended for static html.

You would need to use your own directive instead and either set a template or do your own compiling with $compile.

Alternatively you might be able to use ng-include. There aren't enough details given for your use case to help much more

2 Answers2