<!--头部导航tabs切换-->
<div class="tabs-striped tabs-top tabs-background-positive tabs-color-light">
<div class="tabs buy_nav buy_list_nav">
<ul>
<li class="tab-item buy_color activated" toggle-class="activated" ng-click="changeStatus2(0)"><a href="javascript:void(0)">全部</a></li>
<li class="tab-item buy_color" toggle-class="activated" ng-click="changeStatus2(1)"><a href="javascript:void(0)">待付款</a></li>
<li class="tab-item buy_color" toggle-class="activated" ng-click="changeStatus2(2)"><a href="javascript:void(0)">待发货</a></li>
</ul>
</div>
</div>
</div>
<!--主要内容分三部分选择-->
<div class="list buy_list_con" ng-show="buyall" >
...
</div>
<div class="list buy_list_mine" ng-show="buymine">
...
</div>
<div class="list buy_list_return" ng-show="buyreturn">
...
</div>
<!--以下是该页面控制器-->
.controller('buy_listCtrl',function($scope) {
$scope.buyall = true;
$scope.changeStatus2=function (status) {
// console.log(status);
if(status==0){
$scope.buyall = true;
$scope.buymine = false;
$scope.buyreturn = false;
}else if(status==1){
$scope.buymine = true;
$scope.buyall = false;
$scope.buyreturn = false;
}else if(status==2){
$scope.buyreturn = true;
$scope.buyall = false;
$scope.buymine = false;
}
}
})
<!--在控制器加入指令-->
.directive('toggleClass', function(){
return {
restrict: 'A',
scope: {
toggleClass: '@'
},
link: function(scope, element,attrs){
element.on('click', function(){
element.parent().children().removeClass(scope.toggleClass);
element.addClass(scope.toggleClass);
});
}
};
})