//跳转前页面
<div class="list user_order" ng-click="userOpen('userOrder',0)">
<a class="item item-icon-right" style="background: #FFF;border: none;padding: 0 30px 0 10px;">
我的订单
<span style="float: right;">全部订单</span>
<i class="icon ion-ios-arrow-right" style="right: 0;"></i>
</a>
</div>
<!--订单状态-->
<div class="row textCenter">
<a class="col-20" href="javascript:void(0);" style="width: 20%; " ng-click="userOpen('userOrder',1)">
<img src="app/templates/default/www/img/user01.png" width="40%" /><br>
<span class="color_666 fontsize15">待付款</span>
</a>
<a class="col-20" href="javascript:void(0);" style="width: 20%; " ng-click="userOpen('userOrder',2)">
<img src="app/templates/default/www/img/user02.png" width="46%" /><br>
<span class="color_666 fontsize15">待发货</span>
</a>
<a class="col-20" href="javascript:void(0);" style="width: 20%; " ng-click="userOpen('userOrder',3)">
<img src="app/templates/default/www/img/user03.png" width="45%" /><br>
<span class="color_666 fontsize15">待收货</span>
</a>
<a class="col-20" href="javascript:void(0);" style="width: 20%; " ng-click="userOpen('userOrder',4)">
<img src="app/templates/default/www/img/user04.png" width="39%" /><br>
<span class="color_666 fontsize15">已完成</span>
</a>
<a class="col-20" href="javascript:void(0);" style="width: 20%; " ng-click="userOpen('userAfterbuy')">
<img src="app/templates/default/www/img/user05.png" width="43%" /><br>
<span class="color_666 fontsize15">售后</span>
</a>
</div>
<!--订单状态结束-->
//跳转前页面控制器内的
$scope.userOpen = function(type,tabs){
if(type=="serverOrder"){
$state.go('app.serverOrder');
}else if(type=="userOrder"){
$state.go('app.v2_userOrder',{tab:tabs});
}
}
//跳转后页面路由内
.state('app.v2_userOrder', {
url: '/v2_userOrder',
cache:false,
views: {
'tab-user': {
templateUrl: 'app/templates/default/shop/templates/v2_userOrder.html',
controller:'v2_userOrderCtrl'
}
},
params:{
tab:null //添加参数
}
})
//跳转后页面(改变下划线)
<!--tab切换-->
<div class="order_tab">
<ul>
<li ng-class="{true: 'active', false: ''}[tabNumber == false]" toggle-class="active" ng-click="changeStatus(0)">全部</li>
<li ng-class="{true: 'active', false: ''}[tabNumber == 1]" toggle-class="active" ng-click="changeStatus(1)">待付款</li>
<li ng-class="{true: 'active', false: ''}[tabNumber == 2]" toggle-class="active" ng-click="changeStatus(2)">待发货</li>
<li ng-class="{true: 'active', false: ''}[tabNumber == 3]" toggle-class="active" ng-click="changeStatus(3)">待收货</li>
<li ng-class="{true: 'active', false: ''}[tabNumber == 4]" toggle-class="active" ng-click="changeStatus(4)">已完成</li>
</ul>
</div>
<!--tab切换结束-->
//跳转后页面控制器(内容改变为指定的选项卡内容)
.controller('v2_userOrderCtrl',function($scope,$state,$stateParams) {
$scope.tabNumber = $stateParams.tab;
if($scope.tabNumber == 1){
$scope.payment=true;
}else if ($scope.tabNumber == 2){
$scope.sentGoods=true;
}else if ($scope.tabNumber == 3){
$scope.waitGoods=true;
}else if ($scope.tabNumber == 4){
$scope.completed=true;
}else{
$scope.payment=true;
$scope.sentGoods=true;
$scope.waitGoods=true;
$scope.completed=true;
}
});