angular自定义服务 历史回退到“上一个页面”

在实际项目中,某个页面的入口可能是有多个,但是用户回退的时候,是希望进入之前进来的界面,这样就需要浏览器记住进来的界面

 

解决办法一(使用历史回退):

代码如下

$scope.goBack = function(){
	window.history.back();
};

 

上面的解决方案存在缺陷,应用场景如下:

A 进入 B页面,B回退到A界面,能够正常显示

A 进入 B页面,B进入C界面,然后从C回退到B页面,最后由B页面做“历史回退”,

现象:B回退到了C界面,不满足要求

 

解决办法二(定义一个service专门用于记录历史回退地址

 

1、定义一个记录历史地址的service

/**
 * 备注:
 * 不直接返回json对象的好处是形成了一个“闭包”,外界只能通过方法访问内部的属性backUrl
 * */
angular.module("hkApp").factory("historyUrlService",["$state",function($state){

    //用于记录上一个页面的历史地址
    var backUrl = "";
    function setBackUrl(url){
        backUrl = url;
    }

    function getBackUrl(){
        return backUrl;
    }

    /**
     * 根据statement
     * */
    function goUrlByState(state){
        $state.go(state);
    }

    /**
     * 根据url跳转
     * */
    function goUrlBuyUrl(url){
        window.location.href = url;
    }

    return {
        "goUrlBuyUrl":goUrlBuyUrl,
        "goUrlByState":goUrlByState,
        "setBackUrl":setBackUrl,
        "getBackUrl":getBackUrl
    }
}]);

 

2、进入下一个页面之前,记录当前页面

<div class="item padding_top_5 padding_bottom_5 bg_f2f2f3">
	<div class="row padding_left_10 padding_right_10 ">
		<a class="button button-full  all_width margin_0 bg_ff border_radius_4" style="margin:0;border:1px solid #000" ng-click="toSalesOrderList()">
			销售明细
		</a>
	</div>
</div>

 

angular.module("hkApp").controller("salesGoodsCollectController", ["$scope", "$state",'salesGoodsCollectService','historyUrlService', function ($scope, $state,salesGoodsCollectService,historyUrlService) {

    /*
     * 跳转到  销售明细
     * */
    $scope.toSalesOrderList = function(){
        historyUrlService.setBackUrl(window.location.href);
        $state.go('salesOrderList');
    };

}]);

 

3、回退到上一个页面,需要拿到“记录的地址”

<ion-header-bar class="" align-title="center">
    <a class="button button-clear" ng-click="goBack()">
        <span class="icon ion-ios-arrow-left"></span>
    </a>
    <h1 class="title">销售明细</h1>
</ion-header-bar>

 

/**
 * 回退到上一个页面
 */
$scope.goBack = function(){
	var  url = historyUrlService.getBackUrl();
	if(url == ""){
		historyUrlService.goUrlByState("index");
	}else{
		historyUrlService.goUrlBuyUrl(url);
	}
}

 

 

你可能感兴趣的:(angular自定义服务 历史回退到“上一个页面”)