Dardo: O uso dinâmico de polímeros-ui-tabs e polímeros-ui-páginas não funciona
gostaríamos de usar páginas de polímero-ui-tabs e polímero-ui-dinamicamente. o exemplo estático a seguir funciona bem (o atributo selecionado está definido corretamente, o evento on-polymer-select é acionado)
<polymer-ui-tabs selected="{{selectedTab}}" on-polymer-select="{{mymethod}}">
<span>One</span>
<span>Two</span>
<span>Three</span>
</polymer-ui-tabs>
<polymer-ui-pages selected="{{selectedTab}}" on-polymer-select="{{mymethod2}}" flex>
<span>One</span>
<span>Two</span>
<span>Three</span>
</polymer-ui-pages>
Ao construir o dom dinamicamente, o evento on-polymer-select nunca é acionado e o atributo selecionado é definido apenas para as guias ui do polímero.
@CustomTag('ve-result-dyn')
class ResultElementDyn extends PolymerElement {
Element tabElement;
Element pageElement;
@published dynamic selectedTab;
ResultElementDyn.created(): super.created() {
buildDom();
}
@override
void ready() {
selectedTab = '1';
}
void setSelectedInTab() {
print('in setSelectedInTab $selectedTab');
}
void setSelectedInPage() {
print('in setSelectedInPage $selectedTab');
}
void buildDom(){
print('in buildDom');
tabElement = new Element.tag('polymer-ui-tabs');
tabElement.setAttribute("id","dtabs");
tabElement.setAttribute("selected","{{selectedTab}}");
tabElement.setAttribute("on-polymer-select","{{setSelectedInTab}}");
Element spanelement = new SpanElement();
spanelement.innerHtml = 'One';
tabElement.children.add(spanelement);
spanelement = new SpanElement();
spanelement.innerHtml = 'Two';
tabElement.children.add(spanelement);
spanelement = new SpanElement();
spanelement.innerHtml = 'Three';
tabElement.children.add(spanelement);
this.shadowRoot.append(tabElement);
this.shadowRoot.append(new DivElement());
pageElement = new Element.tag('polymer-ui-pages');
pageElement.setAttribute("id","dpages");
pageElement.setAttribute("selected","{{selectedTab}}");
pageElement.setAttribute("on-polymer-select","{{setSelectedInPage}}");
spanelement = new SpanElement();
spanelement.innerHtml = 'Page 1';
pageElement.children.add(spanelement);
spanelement = new SpanElement();
spanelement.innerHtml = 'Page 2';
pageElement.children.add(spanelement);
spanelement = new SpanElement();
spanelement.innerHtml = 'Page 3';
pageElement.children.add(spanelement);
this.shadowRoot.append(pageElement);
}
Qualquer ideia? Atenciosamente, Anja