Dynamically instantiate, add polymer elements dart -

trying dynamically add polymer elements on click event not able add element

tried using initpolymer (resulting in stack error :element initialized)

4 files.

item.html

<polymer-element name="init-item" >   <template>     <input type="image" src="button_minus_red.gif" on-click="{{remove}}">     {{name}}    </template>    <script type="application/dart" src="item.dart"></script> </polymer-element> 

item.dart:

import 'package:polymer/polymer.dart';  @customtag('init-item') class item extends polymerelement{   @observable string name='hello';   void remove(){     name='';   }   playeritem.created(): super.created(){} } 

index.dart:

      import 'package:polymer/polymer.dart';         import 'item.dart'          // getting unused warning item.dart          main() async{....     //init moved main     initpolymer().then((_) {});     }  //adding form element on click event code run(click event) {   //onready added here     polymer.onready.then((_) { yourplayer.children.add(new element.tag('player-item')) ;});          } 

tag added index.html , dynamic addition shown above.

due above changes when page reloaded automatically getting custom element included. removed element form index.html works expected (no errors)

previous error: when used initpolymer element added in place of tag , within form. on subsequent click events added within form stack error(initialization done)

are there issues due async(highly false)? how should approach this?

item not valid polymer- or custom element name. requirement custom elements must have dash in name my-item.

at top of question write click event code example @ bottom shows you're doing main(). 2 things quite different. if call code in click handler of polymer element should work. if have custom main need ensure polymer initialized before instantiate elements.

see https://stackoverflow.com/a/20982658/217408 more details.

import "package:polymer/polymer.dart";  main() {   initpolymer().then((zone) => zone.run(() {     polymer.onready.then((_) {         var yourplayer = queryselector('#people');       yourplayer.children.add(new element.tag('player-item'));     });   })); }