hello, i am trying to send parameters to a polymer element and i just
cannot find a working example on how to use data-* parameters properly.
this is what i am trying:
<?php
$config = array();
$config['search_ic'] = $params->get('search_input_class', '');
$config['placeholder'] = $search;
$config['myid'] = $myid;
$keyword = $keyword = JRequest::getVar('keyword');
$config['keyword'] = $keyword;
$config['noajax'] = (bool)$no_ajax;
$config['number_of_products'] = $params->get('number_of_products', '');
$config['clang'] = $clang;
$config['url'] = $url;
$config['order_by'] = $params->get('order_by');
?>
<ajaxsearch-app data-params="<?php echo htmlentities(json_encode($params));
?>"/><ajaxsearch-app>
and within the element definition (ajaxsearch-app.html):
<link rel="import"
href="../../bower_components/polymer/polymer-element.html">
<dom-module id="ajaxsearch-app">
<dom-module id="ajaxsearch-app">
<template>
<style>
</style>
<input placeholder="[[dataParams.placeholder]]"
class="inputbox_vm_ajax_search_search_str2 span2 inactive_search "
id="vm_ajax_search_search_str2[[dataset.myid]]" name="keyword"
type="search" value="[[dataset.keyword]]" autocomplete="off"
onblur="javascript: return search_setText('', this,
'[[dataset.myid]]');" onfocus="javascript: aj_inputclear(this,
'[[dataset.number_of_products]]', '[[dataset.clang]]', '[[dataset.myid]]',
'[[dataset.url]]');" onkeyup="javascript:search_vm_ajax_live(this,
'[[dataset.number_of_products]]', '[[dataset.clang]]', '[[dataset.myid]]',
'[[dataset.url]]', '[[dataset.order_by']]); " />
</template>
<script>
/**
* @customElement
* @polymer
*/
class AjaxsearchApp extends Polymer.Element {
ready() {
super.ready();
this.addEventListener('keypress', e => this.handlePress(e));
}
handlePress(e) {
console.log('press');
}
static get is() { return 'ajaxsearch-app'; }
static get ready() {
console.log('ready');
}
static get properties() {
return {
prop1: {
type: String,
value: 'ajaxsearch-app'
},
params: {
type: Object,
value: {}
},
};
}
}
window.customElements.define(AjaxsearchApp.is, AjaxsearchApp);
</script>
</dom-module>
can anyone point me to a documentation or provide a full example of the
element definition and element usage which got both "data-*" definition and
also uses the parameters within the html of the element ? any search in
google for polymer2 ends up at polymer 1 and clicking absolete api link
points to a frontpage instead of the same topic in the documentation. the
documentation only provides partial examples and thus it's not possible to
understand the whole picture.
my goal is to use polymer as compatiblity library for shadow dom usage.
any advise is appreciated,
thank you very much.
stan
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/b285eaf5-680f-4175-b5ef-2961ffdf9b55%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.
