2013-02-11 12 views
11

का उपयोग कर डार्ट में कस्टम इवेंट्स के लिए आप कैसे पंजीकरण करते हैं मैं डार्ट में कस्टमएवेंट (https://developer.mozilla.org/en-US/docs/DOM/Event/CustomEvent) के लिए पंजीकरण करने का प्रयास कर रहा हूं। इसके लिए पुराना कोड था:नई स्ट्रीम एपीआई

window.on['foo'].add((e) => print(e.detail)); 

नई स्ट्रीम एपीआई ने ईवेंट के लिए पंजीकरण के तरीके को बदल दिया है। नए एपीआई का उपयोग करके कस्टमएवेंट्स के लिए आप कैसे पंजीकरण करते हैं?

उत्तर

9

विचार यह है कि कस्टम ईवेंट घोषित किए जाते हैं और अंतर्निहित घटनाओं के समान तरीके से उपयोग किए जाते हैं।

class DataGenerator { 
    static EventStreamProvider<Event> dataEvent = new EventStreamProvider('data'); 
} 

फिर तत्वों पर यह सुनने के लिए: एक बार तत्व उपवर्गीकरण है

DataGenerator.dataEvent.forTarget(element).listen(...); 

यह क्लीनर मिल जाएगा

तो एक कस्टम घटना के लिए, आप की तर्ज पर कुछ करना चाहते हैं समर्थित और घटनाओं को आम तौर पर सीधे उनके तत्व पर निकाल दिया जाता है, और जब ईवेंट सबक्लासिंग कस्टम ईवेंट के लिए अधिक उपयोगी ईवेंट प्रकारों की अनुमति देता है।

हमने window.on['foo'].listen(...) एपीआई रखने पर चर्चा की, लेकिन स्ट्रिंग एक्सेसर्स को हतोत्साहित करने की कोशिश कर रहे हैं क्योंकि कुछ घटनाओं के लिए हम उन्हें विभिन्न ईवेंट नामों में पॉलीफिल करते हैं।

import "dart:html"; 

DivElement dartDiv; 

main() { 
    dartDiv = query("#dartDiv"); 

    // Add a button to generate a CustomEvent called CustomDartEvent. 
    var customEventStreamProvider = new EventStreamProvider<CustomEvent>("CustomDartEvent"); 
    var customEventButton = new ButtonElement() 
    ..text = "Generate custom Dart event" 
    ..classes.add("gwt-Button") // For consistency 
    ..onClick.listen((e) { 
     var detail = { 
     "n": 8, 
     "s": "Hello from Dart", 
     "obj": { 
      "hello": "from Dart"   
     } 
     }; 
     var event = new CustomEvent("CustomDartEvent", 
      canBubble: false, cancelable: false, detail: detail); 
     window.dispatchEvent(event); 
    }); 
    dartDiv.children.add(customEventButton); 

    // Listen for CustomEvents called CustomDartEvent. 
    customEventStreamProvider.forTarget(window).listen((e) { 
    printString(""" 
     Received CustomDartEvent: 
     type: ${e.type}, 
     detail: ${e.detail} 
    """); 
    }); 
} 

void printString(String s) { 
    var div = new DivElement() 
    ..text = s; 
    dartDiv.children.add(div); 
} 
+0

धन्यवाद:

यहाँ एक अधिक पूर्ण उदाहरण है। मुझे वह शॉट दो! –

+0

यह काम किया, इसलिए मैंने एक और पूरा उदाहरण जोड़ा। –

+2

क्या होगा यदि मैं अपनी ऑब्जेक्ट (खिड़की नहीं) के साथ ईवेंट भेजना चाहता हूं? दूसरे शब्दों में, मैं dispatchEvent विधि को कैसे कार्यान्वित करना चाहिए? – tomaszkubacki

संबंधित मुद्दे