I would like to bind a component property value to the URL of my iron-ajax component.
My scenario looks like this...
I have an 'iron-meta' component which I use to store all of my API endpoints like so...
<iron-meta id="services" key="services" value=
'{
"baseApiUrl": {
"foo":"/api/{dynamic_id}",
"bar":"/api/{dynamic_id}/stuff"
}
}'>
</iron-meta>
I then import this meta object into the custom component that requires this endpoint for an iron-ajax and bind the value of this meta object to a "services" property in my custom component, like so...
<iron-meta-query id="query" key="services" value="{{services}}"></iron-meta-query>
For me to use a "services" endpoint that requires a component property value currently I need to access the iron-ajax by id and do a string replace on the API string to replace it with my component property value, like so...
_computeUrl: function(services,dynamic_id) {
return this.services.baseApiUrl.bar.replace("{dynamic_id}", dynamic_id);
}
I would like to directly bind my custom components' "dynamic_id" property to the imported "[[services.baseApiUrl.bar]]" value so that the below sample...
<iron-meta-query id="query" key="services" value="{{services}}"></iron-meta-query>
<iron-ajax id="getHomeData"
auto
handle-as="json"
content-type="application/json"
url$="[[services.baseApiUrl.bar]]"
method="GET"
last-response="{{_response}}">
</iron-ajax>
//dynamic_id = 1234;
...would resolve the iron-ajax URL to look like this...
"/api/1234/stuff"
without having to do any string replace on the imported service URL.
My question is, is there a polymer way to do this, if so, how can I do this?