javascript - AngularJS: how to change location path in routeChangeStart event? - Stack Overflow

admin管理员组

文章数量:1392105

In my application I'm using some query string parameters to resolve links for preselecting some data. But I would like to hide these parameters for users. For example, where I'm using a route like localhost/myapp#/settings?key=dataGrid&value=10, I want to clear these parameters and show user a route like localhost/myapp#/settings.

I tried something like this:

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('');
            }
        });
    }]);

But it does not do anything. On StackOverflow I found something about using $rootScope.$Apply, but if it try it, I get this error: [$rootScope:inprog] $digest already in progress.

In my application I'm using some query string parameters to resolve links for preselecting some data. But I would like to hide these parameters for users. For example, where I'm using a route like localhost/myapp#/settings?key=dataGrid&value=10, I want to clear these parameters and show user a route like localhost/myapp#/settings.

I tried something like this:

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('');
            }
        });
    }]);

But it does not do anything. On StackOverflow I found something about using $rootScope.$Apply, but if it try it, I get this error: [$rootScope:inprog] $digest already in progress.

• javascript
• angularjs
• angularjs-routing

Share Improve this question Follow edited Nov 23, 2014 at 22:03 Owen S. 7,86511 gold badge2929 silver badges4444 bronze badges asked Apr 3, 2014 at 14:39 David SlavíkDavid Slavík 1,20211 gold badge1515 silver badges2424 bronze badges 2

• why passing parameter through URL ? it's not really a good idea, create a service instead. Betting 2$ that you haev a PHP background ;) – Jscti Commented Apr 3, 2014 at 15:25
• 4 @Bixi - maybe it'd be helpful to provide an example of what you mean of using a service instead. And explain why you feel it's not a good idea. – EnigmaRM Commented Apr 3, 2014 at 16:16

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 4

Try: $locationChangeStart to handle page changes. Your code would be as follows:

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

To set a parameter to the url from a controller (without use of a link), the code is as follows:

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

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

});

Live example: http://jsfiddle/Chofoteddy/3wFeR/

That said, your code would be as follows:

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

More info: $rootScope.$on("$locationChangeStart")

本文标签： javascriptAngularJS how to change location path in routeChangeStart eventStack Overflow