Question

在我的应用程序中，我使用一些查询字符串参数来解析用于预选某些数据的链接。但我想为用户隐藏这些参数。例如，在我使用localhost/myapp#/settings?key=dataGrid&value=10之类的路线的情况下，我想清除这些参数并向用户显示localhost/myapp#/settings之类的路线。

我试过这样的事情：

angular.module('myApp')
.run(['$rootScope', '$sce', '$location', '$route',
    function($rootScope, $sce, $location, $route) {
        $rootScope.$on('$routeChangeStart', function(event, next, current) {
            if ($location.url().indexOf('?key=')) {
                var newLocationPath = $location.url().substring(
                    0, $location.url().indexOf('?key='));
                $location.path(newLocationPath).search('');
            }
        });
    }]);

但它没有做任何事情。在StackOverflow上，我发现了一些关于使用$rootScope.$Apply的内容，但如果尝试使用，我会收到此错误：[$rootScope:inprog] $digest already in progress。

Answer 1

尝试： $ locationChangeStart 来处理页面更改。您的代码如下：

$rootScope.$on('$locationChangeStart', function(event, newUrl, oldUrl){
    $rootScope.target = $location.search()['key']; // (equivalent) key = GET[key]
    // $rootScope.target = $location.search().key; // Other solution
});

要从控制器（不使用链接）将参数设置为url，代码如下：

myApp.controller('MyCtrl',function($scope, $location) {

    // setParam('key', 'dataGrid')
    $scope.setParam = function(param, value) {
        $location.search(param, value); // domain.com/#/page?key=dataGrid
    };

});

实例： http://jsfiddle.net/Chofoteddy/3wFeR/

那就是说，你的代码如下：

$rootScope.$on('$locationChangeStart', function(event, newUrl, oldUrl){
    var param = $location.search()['key'];
    $location.path(param).search(''); // Change url and clean params
});

更多信息：$rootScope.$on("$locationChangeStart")

AngularJS：如何在routeChangeStart事件中更改位置路径？

1 个答案: