I have been scouring the web for a clear answer on how to query for an element generated by a dom-repeat element from Dart code.
<template is="dom-repeat" items="[[cars]] as="car>
I'll omit the boilerplate code here, such as imports or the query to my database to fill the cars
property ; everything works fine.
void buttonClicked(e, [_])
PaperDialog infos = this.shadowRoot.querySelector("#dialog");
This generates the following error :
Uncaught TypeError: Cannot read property 'querySelector' of undefined
I have tried several 'solutions', which are not, since nothing works.
The only thing I saw on quite a lot of threads is to use
and write my code in the callback, but that seems like a hack. Why would I need a timer ?
I understand my problem may be that the content of the dom-repeat is generated lazily, and I query the items 'before' they are added to the local DOM.
Another advice I didn't follow is to use Mutation Observers. I read in the polymer API documentation that the observeNodes method should be used instead, as it internally uses MO to handle indexing the elements, but it again seems a bit complicated just to open a dialog.
My final objective is to bind the button of each generated model to a dedicated paper-dialog to display additional information on the item.
Has anyone ever done that ? (I should hope so :p)
Thanks for your time !
After reading Gunter's advices, although none of them actually worked by themselves, the fact that the IDs aren't mangled inside a dom-repeat made me think and query paper-dialog
instead of the id itself, and now my dialog pops up !
PaperDialog infos = Polymer.dom(root).querySelector("paper-dialog");
I now hope that each button will call the associated dialog, since I'll bind data inside the dialog relative to the item I clicked ~