How to write HTML code in $rootScope variable using angularJS?

Question

I am trying to change the value of a label in my HTML page on an event,is it possible to insert html code into the variable?

The

HTML

code is like:

<div ng-controller="welcomeCon" ><label>{{ welcomemsg }}</label></div>

and in some

controller

in the script:

$rootScope.welcomemsg="You are not logged in,please log in or register"

Is there a way to make the words

log in

and

register

to be links?
If no, I would be happy if someone could guide me what to do in alternative.

Thanks

Recommended for you: Get network issues from WhatsUp Gold. Not end users.

Answer 1

You can do that as the other answers suggest by using the $sce service or ng-bind-html, but I would object to that approach because the links won't change, so why do it by defining the html in your code instead of in the html.

What you probably want is something like this:

<ul class="my-menu">
    <li ng-if="$root.loggedIn">
        <a href="url/to/logout">Logout</a>
    </li>
    <li ng-if="!$root.loggedIn">
        You are not logged in, please <a href="login">login</a> or <a href="register">register</a>
    </li>
</ul>

How to write HTML code in $rootScope variable using angularJS?

Sign up