javascript - change color of current page angularjs -

does angularjs in way setting active class on link current page?

i imagine there magical way in angularjs or css done, can't seem find.

my menu looks like:

<ul>   <li ><a href="#/person" ng-click = "person()" id="bl" >person</a></li>  <li><a href="#/product" ng-click = "product()" id="or"  >product</a></li>  <li ><a href="#/place" ng-click = "place()" id="gr" >place</a></li>  </ul><br/><br/>

my css looks like:

body {  font-family: source sans pro;  }    ul {      float: left;      width: 100%;      padding: 0;      margin: 0;      list-style-type: none;  }      a{      float: left;      width: 6em;      text-decoration: none;      padding: 0.2em 0.6em;      border-right: 1px solid white;  	  }    #navbar li a.current {  background-color: #fff;}    li {      display: inline;  }    #bl {  background-color:#5a5a5a;  color: yellow;  }    #or {  background-color:#5a5a5a;  color: yellow;  }    #gr {  background-color : #5a5a5a;  color: yellow;  }    #bl:hover ,#or:hover , #gr:hover   {   background-color:#ff6900;   }      #persons{   float:left;    }      .left{    float:left;   }   

looks have functions person(), product(). set background-color using getelementsbyname('body').style.backgroundcolor = 'red'; , respective colors in respective functions.