2012-01-16 14 views
42

डीओएम में एम्बर व्यू डालने के बाद मैं फ़ंक्शन कैसे चला सकता हूं?Ember.js का उपयोग करके, दृश्य के बाद मैं कुछ जेएस कैसे चला सकता हूं?

यहां मेरा उपयोग-मामला है: मैं सॉर्टिंग की अनुमति देने के लिए jQuery UI सॉर्ट करने योग्य का उपयोग करना चाहता हूं।

उत्तर

64

आपको didInsertElement को ओवरराइड करने की आवश्यकता है क्योंकि यह "कॉल के तत्व को डीओएम में डाला गया है जब कॉल किया गया है। इस फ़ंक्शन को किसी भी सेट अप करने के लिए ओवरराइड करें जिसके लिए दस्तावेज़ निकाय में कोई तत्व आवश्यक है।"

didInsertElement कॉलबैक के अंदर, आप दृश्य के तत्व के लिए jQuery ऑब्जेक्ट प्राप्त करने के लिए this.$() का उपयोग कर सकते हैं।

संदर्भ: https://github.com/emberjs/ember.js/blob/master/packages/ember-views/lib/views/view.js

+10

के लिए didInsertElement के अपने ओवरराइड भीतर पढ़ा है, आप संदर्भित कर सकते हैं 'यह। $()' डोम तत्व के लिए jQuery आवरण के लिए एक संभाल पाने के लिए। –

+3

मार्क: आपको यह लेख उपयोगी भी मिल सकता है। इससे मुझे उस दिन वापस मदद मिली जब मुझे जेयूआई और एससी 2 काम करना पड़ा। नोट: इस आलेख को लिखा गया था क्योंकि कुछ एपीआई बदल गए हैं, इसलिए यह कोड को काट और पेस्ट नहीं किया जा सकता है। [http://yehudakatz.com/2011/06/11/using-sproutcore-2-0-with-jquery-ui/](http://yehudakatz.com/2011/06/11/using-sproutcore-2 -0-साथ-jquery-ui /) –

+0

बहुत बहुत धन्यवाद!यह जवाब प्लस उन दो टिप्पणियों ने वास्तव में मुझे यह समझने में मदद की। मैं अब तक एम्बरजेएस समुदाय समर्थन से प्रभावित हूं। –

0

आप अपने दृश्य में आप जो कुछ भी चाहता हूँ आग didInsertElement कॉलबैक में की जरूरत है:

MyEmberApp.PostsIndexView = Ember.View.extend({ 

    didInsertElement: function(){ 
    // 'this' refers to the view's template element. 
    this.$('table.has-datatable').DataTable(); 
    } 

}); 
+1

यदि आप इसे इस तरह कहते हैं, तो आपको शीर्ष पर यह ._super() जोड़ना होगा। – SwarmIntelligence

1

तुम भी afterRender विधि

didInsertElement: function() { 
Ember.run.scheduleOnce('afterRender', this, function() { 
    //Put your code here what you want to do after render of a view 
    }); 
} 
0

एंबर 2 उपयोग कर सकते हैं। एक्स: व्यू को बहिष्कृत किया गया है, इसके बजाए घटक का उपयोग करें

आपको यह जानने के लिए घटक की जीवनशैली को समझना होगा कि कुछ चीजें कब होती हैं।

जैसे घटक प्रस्तुत किए जाते हैं, फिर से प्रस्तुत किए जाते हैं और अंततः हटा दिए जाते हैं, एम्बर लाइफसाइकिल हुक प्रदान करता है जो आपको घटक के जीवन में विशिष्ट समय पर कोड चलाने की अनुमति देता है।

https://guides.emberjs.com/v2.6.0/components/the-component-lifecycle/

आम तौर पर, didInsertElement 3 पक्ष के पुस्तकालयों के साथ एकीकृत करने के लिए एक महान जगह है।

यह हुक दो (2) बातें,

  1. घटक के तत्व दोनों बनाया है और डोम में सम्मिलित किया गया गारंटी देता है।
  2. घटक का तत्व घटक के $() विधि के माध्यम से सुलभ है।

में आप जावास्क्रिप्ट की जरूरत को चलाने के लिए जब भी विशेषताएं परिवर्तित

didRender हुक के अंदर अपना कोड चलाएँ।

एक बार फिर, कृपया जीवन चक्र प्रलेखन ऊपर अधिक जानकारी

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

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