Polymer automatic node finding with dynamic id value
How can I access node that have dynamic id value using Polymer node finding by id?
For example
-
According to this document in Polymer 2.x
$$is not supported, so usethis.shadowRoot.querySelectorinstead.console.log(this.shadowRoot.querySelector('#' + id));If you are using Polymer 1.x then you can use
$$.讨论(0) -
You can use
$like a hash:id = 'computed_element_id'; this.$[id];讨论(0) -
It's true that a JavaScript hash can be accessed using either dot
.or array[]notation. If you have a literal name, you can use dot notationthis.$.some_id. If you have an indirection, likethis.id = 'some_id', then you can use array notationthis.$[this.id]to find the same value.The tricky part is that Polymer only populates
$array after first stamping the template, which happens beforeready. If you had an external binding tothis.id,this.$.[this.id]would work, but since you are settingthis.idinreadyit's too late for the$convenience.In this case, you can instead query your shadowRoot directly:
this.shadowRoot.querySelector('#' + this.id)Pro tip: at some point a subclass may supply a new template, in which case
this.shadowRootwill point to the new shadow-root and not the superclass version. For this reason, it's best to install a named div you can query against, e.g.this.$.id_div.querySelector('#' + this.id').讨论(0) -
Polymer provides a method to this (source):
For locating dynamically-created nodes in your element's local DOM, use the $$ method:
this.$$(selector)$$returns the first node in the local DOM that matches selector.In your case, this should work:
console.log(this.$$('#' + id));讨论(0)
加载中...
- 热议问题