在angularJS中如何让bootstrap的按钮组实现排他事件呢？

Question

点击不同的按钮，则当前按钮的背景色发生改变，其他的按钮变成白色，这样的事件很容易实现的，但是放在angular中却不起效，获取不到类，请大神指点。代码如下：                        <div class="btn-group">                            <button type="button" class="btn btn-default btn-sty active" ng-click="load(1)">今日</button>                            <button type="button" class="btn btn-default btn-sty" ng-click="load(2)">昨日</button>                            <button type="button" class="btn btn-default btn-sty" ng-click="load(3)">本月</button>                        </div>JQ实现如下：$(function () {    $(".btn-sty").click(function () {        // console.log($(this),1)        $(this).addClass('active').siblings().removeClass('active');    });})

Answer 1

ng-class来控制样式

<button type="button" class="btn btn-default btn-sty" ng-class="{'active': index === 1}" ng-click="load(1)">今日</button>

<button type="button" class="btn btn-default btn-sty" ng-class="{'active': index === 2}" ng-click="load(2)">昨日</button>

<button type="button" class="btn btn-default btn-sty" ng-class="{'active': index === 3}" ng-click="load(3)">本月</button>

ctrl中

$scope.load = function(num) {
    $scope.index = num;    // ...}