Tạo menu activate với angular

Tạo menu activate với angular

Cách làm menu khi click vào sẽ sáng lên với angular

Khi làm app web muốn click vào menu thì menu đó activate để người sử dụng biết

B1:
Định nghĩa css, ví dụ nếu thẻ bọc là id=category thì

<style>
#category ul li
{
    float:left;
}

#category ul li a
{
    color: #0000FF;
    margin: 3px;
    border-bottom-style: solid;
    border-bottom-width: 1px;
    border-bottom-color: #0000FF;
}

#category ul li a.active
{
    background-color: #0000FF;
    color: #FFFFFF;
    margin:3px;
}
</style>

 

B2:

Thêm ng-click="click_TabBangGia($event)"

<div id="category">
<ul>
    <li ng-repeat="x in Data">
    <a href="#"  ng-click="click_TabClick($event)"  > ... </a>
    </li>
</ul>
</div>
<script type="text/javascript">
 //... lệnh app angular
  $scope.click_TabClick= function (t,$event) {
            li_list =  angular.element($event.target).parent().parent().parent().find("li"); //lấy danh sách thẻ li ra làm 1 mảng        
            $(li_list).each(function() {
                var $this = $(this);
                $this.find("a").removeClass('active');
            });
            angular.element($event.target).addClass('active'); //li đang click , thêm class active
            
     };
</script>
 

Bài viết liên quan:

Tạo menu activate với angular