angular点击button切换相对页面同时按钮变颜色

html代码：

#aaa .active{background-color: #7dc35a !important;}<div class="portlet-body"><div id="aaa"><button class="pull-left" type="button" ng-class="{ 'changeTab' : data.current == 1,'active': data.current == 1}" ng-click="setCurrent(1)">第一个</button><button class="pull-left" type="button" ng-class="{ 'changeTab' : data.current == 2 ,'active': data.current == 2}" ng-click="setCurrent(2)">第二个</button><button class="pull-left" type="button" ng-class="{ 'changeTab' : data.current == 3 ,'active': data.current == 3}" ng-click="setCurrent(3)">第三个</button></div><div><div ng-if="data.current == 1"><div class="portlet-body">第一个button对应的内容</div></div><div ng-if="data.current == 2"><div class="portlet-body">第二个button对应的内容</div></div><div ng-if="data.current == 3"><div class="portlet-body">第三个button对应的内容</div></div></div></div>

js代码：

$scope.data = {current: "1" // tab's number}$scope.setCurrent= function (param) {$scope.data.current = param;}

如果点击了按钮 触发setCurrent函数，data.current会有对应的值， ng-if 会把对应的值绑定到div上，true的话，显示该div内容。同时active存在在button上，样式表的按钮颜色附加到按钮上。

ng-class里的值会附加到class后。