Send event from parent to child element in polymer.dart -
i trying fire event polymer element, , listen event in element inside of it.
these 4 files of consequence:
main_app.html
<link rel="import" href="../../packages/paper_elements/paper_input.html"> <link rel="import" href="../../packages/paper_elements/paper_button.html"> <link rel="import" href="canvas_container.html">; <polymer-element name="main-app"> <template> <paper-button on-click="{{onbuttonclicked}}">text</paper-button> <canvas-container"></canvas-container> </template> <script type="application/dart" src="main_app.dart"></script> </polymer-element> main_app.dart
import 'dart:html'; import 'package:polymer/polymer.dart'; @customtag('main-app') class mainapp extends polymerelement { mainapp.created() : super.created(); onbuttonclicked(event event, var detail, node sender) { print('button clicked'); fire('test'); } ready() { super.ready(); } } canvas_container.html
<polymer-element name="canvas-container"> <div on-test="{{testaction}}"> <template> <div> <canvas id="canvas"></canvas> </div> </template> </div> <script type="application/dart" src="canvas_container.dart"></script> </polymer-element> canvas_container.dart
import 'dart:html'; import 'package:compbook/stave.dart'; import 'package:compbook/clef.dart'; import 'package:polymer/polymer.dart'; @customtag('canvas-container') class canvascontainer extends polymerelement { canvaselement canvas; canvasrenderingcontext2d context; canvascontainer.created() : super.created(); ready() { this.canvas = $['canvas']; canvas.width = 1000; canvas.height = 1000; context = canvas.context2d; testaction(event e, var detail, node sender) { print('event has been received'); } } when click paper-button, event trigger correctly, not being received canvas-container @ all. insight problem appreciated
the polymer documentation has section topic https://www.polymer-project.org/0.5/articles/communication.html#sending-messages-to-siblingschildren
subscribe event on parent , re-fire on each child.
Comments
Post a Comment