Hi,
I am using more-routing to navigate between pages (core-pages and sections)
which is working fine. Now I want to go one step ahead with more-routing
parameters to pass from one element to another and based on that a JSON
string would be filtered in the second element to show up the desired
output.
Here is what I am trying:
<template repeat="{{customer in customers}}">
<section route="customers">
<div class="single-customer-info">
<p><a title="{{customer.name}}"
href="{{urlFor('customer-detail',
{cust: customer.cuname})}}" class="customer-name">{{customer.name}}</a></p>
</div>
</section>
</template>
which when renders creates URLs of the following pattern:
http://localhost:9000/#!/customers/cyfox
"cyfox" is the key for the second element which I want to grab and pick up
the correct data from the following JSON and finally display it on screen.
this.custDetails = [
{ "cuname": "cyfox", "name": "Cyfox Papers Ltd.", "addr"
: "2, Strand Road", "addr2": "Kolkata, IN", "phone": "332.245.9910", "desc": "A
leading paper merchant of Eastern India", "braches": [
{ "email": "[email protected]", "phone":
"1582012244", "address": "69/A, Twisted Road, Banjara Hills, Hyderabad:
600001", "code": "CPHYD" }
]
},
{ "cuname": "indplast", "name": "India Plastics", "addr"
: "6/B, Pragati Apartment", "addr2": "Pitampura, New Delhi, IN", "phone":
"493.050.2010", "desc": "We convert Indian plastic products international",
"braches": [
{ "email": "[email protected]", "phone":
"913345678900", "address": "25, Bamungachi Lane, Alipore. Kolkata - 705660",
"code": "INDPKOL" },
{ "email": "[email protected]", "phone":
"9133210056", "address": "Sevak Tower, 1st Floor. Sevak Road, Siliguri",
"code": "INDPSGR" }
]
}
];
But I don't know how to pass this "cyfox" as the parameter to the second
element (customer-detail).
I went through the Polycast series by Rob Dodson on YouTube, specially the
one for more-routing. I am also referring to
https://www.polymer-project.org/0.5/articles/spa.html but no where I could
see how parameter could be passed across different elements (or I did not
understand!).
Please help. Thanks in advance.
Subrata
On Saturday, 15 March 2014 02:53:26 UTC+5:30, Andrew Huth wrote:
>
> For anyone looking for client-side routing, I've made a collection of
> Polymer elements called <app-router> <https://github.com/ahuth/app-router>
> .
>
> To use it, you set up routes (the target attribute specifies where views
> will get rendered into):
>
> <app-router target="#main">
> <app-route to="index">/</app-route>
> <app-route to="contact">/contacts/:id</app-route>
> </app-router>
>
> And then you set up views that correspond to the to attributes on the
> routes:
>
> <app-views>
>
> <template name="index">
> <p>This is the main page</p>
> </template>
>
>
> <template name="contact">
> <p>This is contact {{ id }}</p>
> </template>
>
> </app-views>
>
> Url parameters (in this example 'id') get passed into the views.
>
> What are your guy/gal's thoughts on this? I'm not a big fan of having the
> view definitions on the page. Not sure how else to do it, though. This is
> also my first Polymer element, so it may not be as Polymeric as it could
> be. Any pointers on that are greatly appreciated.
>
> Finally, how should this be packaged? It's really a collection of 3
> Polymer elements. Should they be separate, or combined into one package
> together?
>
> <app-router>, <app-route>, and <app-views> are all available at
> github.com/ahuth/app-router. Get it while supplies last!
>
> P.S. This is a rewrite of an earlier post (now deleted) because I didn't
> like how I worded it before.
>
Follow Polymer on Google+: plus.google.com/107187849809354688692
---
You received this message because you are subscribed to the Google Groups
"Polymer" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To view this discussion on the web visit
https://groups.google.com/d/msgid/polymer-dev/78925055-cf2e-4296-bf18-fc5b8e002104%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.
