erikringsmuth / app-router

Router for Web Components
https://erikringsmuth.github.io/app-router/
MIT License
610 stars 83 forks source link

regular expression + data binding #27

Open ghost opened 9 years ago

ghost commented 9 years ago

I think app-router could use regular expressions in order to match path variables. Regex with named captures would be great but Javascript doesn't support them natively (xregexp is a js library that support named captures). Even simple native capture groups (by index number) would be great.

An example:

<!-- url -->
http://www.example.com/demo/15

<!-- route, notice variables attribute  -->
<!-- first capure [word (\w+)], second capture [number (\d+)] -->
<app-route path="/^\/(\w+)\/(\d+)$/i" regex variables="word number" import="/pages/regex-page.html"></app-route>

<!-- data binding -->
<regex-page word="demo" number="15"></order-page>

It's much more powerful than actual path variable data binding (using semicollon like :pathArg1). Thank you for app-router.

erikringsmuth commented 9 years ago

Named capture groups definitely sound like the best approach. I really wish JS supported them natively.

It would also be easy to switch my regex from test() to exec() and bind the array to a regex attribute or multiple named attributes the way you're suggesting.

I'm going to go through what other routers did and see if there are any easy solutions to get named capture groups in-line in the regular expression. Otherwise I'll switch it to exec() and bind the capture groups.