2015-04-06 16 views
2

我想改變元件的背景色顏色當它是活性裏的顏色。下面是我的HTML頁面,並有在HTML頁面鏈接它們綁定到js文件的狀態..我怎樣才能使用的變化幅度和整個背景的顏色UI-S REF-活躍變化背景,並使用UI-SREF活性

.state ('home', { 
 
      url: "/home", 
 
      abstract: true, 
 
      templateUrl:"app/templates/home.html", 
 
      controller: "WallCtrl" 
 
     }) 
 
     .state('home.updates', { 
 
      url: "/updates", 
 
      views: { 
 
       'menuContent': { 
 
        templateUrl: "app/templates/updates.html" 
 
        
 
       } 
 
      } 
 
     }) 
 

 
     .state('home.discover', { 
 
      url: "/discover", 
 
      views: { 
 
       'menuContent':{ 
 
        templateUrl: "app/templates/discover.html", 
 
        controller: "DiscoverCtrl" 
 
       } 
 
      } 
 
     }) 
 

 

 
.state('MyFollowList',{ 
 
      url:'/myfollowlist', 
 
      templateUrl:'app/templates/myfollow.html', 
 
      controller: 'MyFollowCtrl', 
 
      resolve: { 
 
       product_list: function ($http, ApiService, $log) { 
 
        $log.log("url entered :"+ url) 
 
        var result = $http.get(url+ ApiService.get_url('get_list')).success(function (data) { 
 
         $log.log("data resolved: "+ JSON.stringify(data)) 
 
         return data; 
 
        }).error(function (err) { 
 
         $log.log(err) 
 
         return err; 
 
        }); 
 
       return result; 
 
       } 
 
      } 
 
     })
.activeClass{ 
 
    background:rgb(251,251,251);; 
 
    color:rgb(217,52,7); 
 
}
<div class="lists"> 
 
    <ul list-style-type="none" class="user_Lists"> 
 
     <li class="item" menu-close ui-sref-active="activeClass"><a ui-sref="home.updates">   <div class="HomeiconImg"></div><span>Home</span> </a></li> 
 
     <li class="item" menu-close ui-sref-active="activeClass"><a ui-sref="home.discover">   <div class="DiscovericonImg"></div><span> Discover</span></a></li> 
 
     <li class="item" menu-close ui-sref-active="activeClass"><a ui-sref="#"> 
 
      <div class="ActivityiconImg"></div> <span>My Activity</span></a></li> 
 
     <li class="item"menu-close ui-sref-active="activeClass" ><a ui-sref="MyFollowList">   <div class="FollowiconImg"></div><span>My Follow List </span></a></li> 
 
     <hr> 
 
     <li class="item" menu-close><a href="#">Invite Friends</a></li> 
 
     <li class="item"menu-close><a href="#">Mock Search</a></li> 
 
     <li class="item" menu-close><a href="#">Logout </a></li> 
 
        </ul>

回答

1

我想github Issue上已經有這個問題了,它不適用於抽象和子狀態。

您可以檢查替代解決方案。

Stackoverflow這question

它使用的方式從問題

考慮到comeout: -

ng-class="{activeClass: $state.includes('posts')}" 

在控制器: -

$scope.$state = $state;