I have created a button on a bootstrap navbar that will change color, cursor and name depending on a boolean variable. The navbar is always on the top of the site.
My navbar HTML bytton looks like this:
<ul class="nav navbar-nav navbar-right" style="margin-top: 15px;">
<a role="button" ng-click="vm.commit()" style="color: {{vm.canCommit | commitColor}}; cursor: {{vm.canCommit | commitCursor}}">{{vm.canCommit}}</a>
</ul>
vm.canCommit is the variable that changes the attributes of the button. The canCommit() function flips the vm.canCommit variable.
function commit() {
vm.canCommit = !vm.canCommit;
console.log("commiting " + vm.canCommit);
}
All this works fine when i am in the route home and angular controller home where the functions and variable is defined, but when i change route and click the button console log appears with the right output but the color, cursor and name does not update anymore.
What shall i do to make this work?