在AngularJS中单击更改div背景颜色

kra*_*mer 2 html javascript css angularjs

我正在使用AngularJS在我的网页中创建标签.如何在单击(选中)时更改选项卡的背景颜色?

这个代码的JSFiddle可以在以下网址找到:http://jsfiddle.net/x8xfM/2/ 因此,例如,在单击tab1时,它变为红色,当单击tab2时,tab1再次变黑并且tab2背景颜色变红了.

<div  ng-app ng-controller="sample" ng-init="tab=1">

        <div class="cb" ng-click="tab = 1">tab 1</div>
        <div class="cb" ng-click="tab = 2">tab 2</div>

        <div ng-show="tab == 1">
            <p>first</p>
         </div>

        <div ng-show="tab == 2">
            <p>second</p>
        </div>
</div>

.cb {    
    list-style: none;
    padding: 10px;
    display:inline-block;
    background-color: #000;  
    color: #FFF;
    border: 1px solid black;
    border-radius: 5px;
}
.cb:hover{
    background-color: #4a4a4a; 
    color: #FFF;
}
Run Code Online (Sandbox Code Playgroud)

Sei*_*ria 6

为了从谷歌可能偶然发现这一点的人的利益:

使用该ng-class指令.这是一个使用上面例子的jsfiddle:http://jsfiddle.net/x8xfM/43/