2013-09-26 41 views
11

Tôi muốn một phần tử con gửi một sự kiện tùy chỉnh và phần tử gốc để nghe và thực hiện một số hành động. Làm thế nào để làm điều này khi làm việc với Polymer?Làm thế nào để bạn gửi và nghe các sự kiện tùy chỉnh trong Polymer?

+0

thể trùng lặp của [Làm thế nào để bắn một sự kiện tùy chỉnh từ Polymer Dart ?] (http://stackoverflow.com/questions/18971511/how-do-i-fire-a-custom-event-from-polymer-dart) –

Trả lời

14

Bạn có thể gửi một sự kiện tùy chỉnh từ một phần tử polymer như thế này:

dispatchEvent(new CustomEvent('nameOfEvent')); 

Sau đó, yếu tố phụ huynh có thể nghe cho sự kiện tùy chỉnh như thế này:

<child-element on-childspeaks="fireAway"></child-element> 

Đây là một hoàn chỉnh hơn ví dụ cho thấy cách hoạt động của nó. Thứ nhất, đây là mã cho các phần tử con:

<!DOCTYPE html> 

<polymer-element name="child-element"> 
    <template> 
    <div on-click="dispatch">I am a child</div> 
    </template> 
    <script type="application/dart"> 
    import 'dart:html'; 
    import 'package:polymer/polymer.dart'; 

    @CustomTag('child-element') 
    class ChildElement extends PolymerElement with ObservableMixin { 

     dispatch(Event e, var detail, Node sender) { 
     print('dispatching from child'); 
     dispatchEvent(new CustomEvent('childspeaks')); 
     } 
    } 
    </script> 
</polymer-element> 

Và đây là mã cho các yếu tố phụ huynh:

<!DOCTYPE html> 
<link rel="import" href="child_element.html"> 
<polymer-element name="parent-element"> 
    <template> 
    <div>I am the parent</div> 
    <child-element on-childspeaks="fireAway"></child-element> 
    </template> 
    <script type="application/dart"> 
    import 'dart:html'; 
    import 'package:polymer/polymer.dart'; 

    @CustomTag('parent-element') 
    class ParentElement extends PolymerElement with ObservableMixin { 

     void fireAway() { 
     window.alert('The child spoke, I hear'); 
     } 
    } 
    </script> 
</polymer-element> 
+0

Phần 'with ObservableMixin' có cần thiết không? –

Các vấn đề liên quan