AngularJS routing for dynamic urls, how?

Question

I'm trying to understand how can i configure my angularJS routing given the following case:

We have a search page where we display the search results based on tags provided (1..n tags). we would like that a user to be able to parse enter a url as the following and our system to do the search and show the respective results.

The url format should be:

http://mywebsite.com/search/<term1>/<term2>/<termN>...so it could be different number of terms.

I was looking into the route provide and couldn't figure out a way to do it dynamically.

i saw that i could put in the routeprovid:

.when('/search/:searchParams',... but that handles only when i have one term...is there anyway to configure it to take as many terms as is given?

score 0 · Answer 1 · answered Jul 11 '13 at 15:57

0

Does this help you at all? Seems to support dynamic routing and you could probably cut apart the :name parameter to do what you wish, perhaps.

http://gregorypratt.github.io/AngularDynamicRouting/

Ken

answered Jul 11 '13 at 15:57

Ken Rimple

233
2
6

score 0 · Answer 2 · answered Jul 12 '13 at 05:34

You could try base64ing your searchParams:

.when('/search/:searchParams', {controller:'SearchCtrl'})

function SearchCtrl($routeParams, $location){
    //Assuming your params are an array like ['param1', 'param2', 'param3']
    //You could easily adapt this to base64 a JSON object
    function encodeParams(params){
        return window.btoa(params.join(';'));
    }

    function decodeParams(string){
        return window.atob(string).split(';');
    }

    var searchParams = decodeParams($routeParams.searchParams);

    scope.search = function(params){
        $location.path('/search/' + encodeParams(params));
    }
}

score 0 · Answer 3 · answered Aug 02 '13 at 06:02

My solution may be looks not so glad, but it's works at least:

You may organize your routs in way

yoursite.com/term1Name/**:param1**/term2Name/**:param2**/term3Name/**:param3**

To make it's clear, you may do your routes seems like REST routes. For example I'm want to go to a list of a services:

www.yoursite.com/servises/

Go to the one of the services:

www.yoursite.com/servise/:id

And if I'm want to see some of the service details, I'll do:

www.yoursite.com/servise/:id/details

and so

www.yoursite.com/servise/:id/detail/:id

AngularJS routing for dynamic urls, how?

3 Answers3