I have an app where I use the Url as state holder for the app. And also provide deep linking functionality. This require the use of multiple optional params. I could do it using ugly query string but would like to be able to use “good-looking” urls..
I.e.
this.get('#/test/:p1/?:p2?/?:p3?/?:p4?/?:p5?/?:p6?/', function () {
$("#params").empty().show().append("<p>" + this.params + "</p>");
});
url: http://localhost:6495/sammy.html#/test/v1/v2/v3/v4/v5/v6/
Gives: {"p1": v1,"p2": v2,"p3": v3,"p4": v4,"p5": v5,"p6": v6}
So http://localhost:6495/sammy.html#/test/v1/v6/ à {"p1": v1,"p2": v6,"p3": ,"p4": ,"p5": ,"p6": }
url: http://localhost:6495/sammy.html#/test/v1/////v6/
Gives: {"p1": v1,"p2": ,"p3": ,"p4": ,"p5": ,"p6": v6}
Which is not a practical solution..
Is there a way to use a key value approach with optional params?
I.e.:
A rout supporting
http://localhost:6495/sammy.html#/test/key1/value1/key2/value2/key3/value3/key4/value4/
and
http://localhost:6495/sammy.html#/test/key1/value1/key4/value4/
bonus question..
In many examples I see routes containing “!” ('#!/key1/:key1/key2/:key2')
What is the meaning of the hashtag Exclamation Mark combo? It’s not working in my examples..
this.get('#/test/:p1/:p2/:p3/:p4/:p5/:p6', runRoute);
this.get('#/test/:p1/:p2/:p3/:p4/:p5', runRoute);
this.get('#/test/:p1/:p2/:p3/:p4', runRoute);
this.get('#/test/:p1/:p2/:p3', runRoute);
...etc
function runRoute() {
//route code here
}
As for the route not working when you include the hash bang (#!/), it's because you must also include it in your URL.
Hope this helps,
Chris