2013-12-12 10 views
6

लागू करें इस उदाहरण में, मेरे पास एक संलग्न निर्देश के साथ एक इनपुट है। निर्देश इनपुट के बगल में संदेश प्रदर्शित करने के लिए है। संदेश जोड़ने के लिए एक और इनपुट और एक बटन है। एक बार कुछ संदेश प्रदर्शित होने पर, संलग्न निर्देश के साथ इनपुट पर ध्यान केंद्रित करने से संदेशों को साफ़ करना चाहिए। http://jsfiddle.net/viro/WBqxf/

तो मेरे पास एक अलग मॉडल के साथ निर्देश है, और मैं उस मॉडल को अद्यतन करने की कोशिश कर रहा हूं जब निर्देश वाला तत्व फोकस में जाता है। ऐसा लगता है जैसे मैं दायरे में घटना कॉलबैक रैप करने के लिए है $ अगर मैं मॉडल को अपडेट करना चाहते लागू होते हैं:।

element.on('focus',function(){ 
    scope.$apply(function(){ 
     console.log("focus !"); 
     scope.tstMsg=[]; 
    }) 
}); 

मुझे लगता है मैं $ उस में रैप करने के लिए क्योंकि मैं jqlite घटना कॉलबैक और मैं उपयोग कर रहा हूँ लागू है अनुमान लगाएं कि वे "बाहरी" कोणीय जेएस चलाते हैं, लेकिन मुझे दस्तावेज़ों में स्पष्ट रूप से यह नहीं मिला।

क्या मैं इसे सही कर रहा हूं या यह हैक है?

क्या ऐसा करने का कोई बेहतर तरीका है?

+0

'एनजी-फोकस' का उपयोग करें और एक्स्ट्रेनल इवेंट हैंडलर के लिए स्वयं को अतिरिक्त कोडिंग सहेजें http://docs.angularjs.org/api/ng.directive:ngFocus – charlietfl

+0

लेकिन प्रत्येक तत्व के लिए जिसमें निर्देश संलग्न है, मैं वही व्यवहार चाहता हूं फोकस पर, नियंत्रक के बावजूद जिसमें तत्व है। NgFocus के साथ मैं प्रत्येक तत्व के लिए एक ऐसा फ़ंक्शन बनाने के लिए होता जो संदेश की सरणी को रीसेट करता है, अगर यह निर्देश द्वारा स्वचालित किया जा सकता है तो यह कठिन है, है ना? –

उत्तर

2

गुंजाइश। $ आवेदन करने के लिए एक $ पाचन चलाने का कारण बन जाएगा ताकि दायरे पर किसी भी दर्शक को जहां उचित हो वहां परिवर्तन और आग की जांच होगी। चूंकि आप कहते हैं कि आप किसी ईवेंट के लिए बाध्यकारी हैं (केवल addEventListener/attachEvent उपयुक्त के रूप में) दायरे को कर रहे हैं। इस संदर्भ में $ लागू लागू है।

+0

तो इसका मतलब है कि element.on से बंधे कॉलबैक "angularJS जागरूक" नहीं हैं? मैं इसके बारे में निश्चित नहीं था। –

+0

हाँ जैसा कि आप सवाल में कहते हैं क्योंकि यह सिर्फ jqLite या jQuery का उपयोग कर रहा है (यदि आप इसे शामिल करते हैं) यह कोणीय कोड के संदर्भ में नहीं है। $ Http और $ टाइमआउट जैसी सेवाओं में स्वचालित रूप से दायरा है। $ – shaunhusain

+0

पर कॉल करें, तो बस सेटटाइमआउट के बजाय $ टाइमआउट है; क्या ऐसा कुछ है जिसका प्रयोग तत्व के बजाय किया जाना चाहिए। –

3

जब भी आप एक थर्ड पार्टी लाइब्रेरी का उपयोग कर रहे हों और परिवर्तन करें तो आपको $apply() पर कॉल करके कोणीय को जाने की आवश्यकता है।

@charlietfl उल्लेख किया है एनजी फोकस और भी आसान है:

Controler

$scope.focus = function() { 
    // Do something 
} 

एचटीएमएल

<input ng-model="inp" tst-msg="message" ng-focus="focus()" /> 

देखें jsFiddle

+0

किसी कारण से जब मैंने $ आवेदन किए बिना किया, तो यह काम नहीं करेगा। मुझे यह जांचना है। एनजी-फोकस मेरे लिए समाधान नहीं है क्योंकि मैं निर्देश स्वयं को पर्याप्त बनाना चाहता हूं। मैं ऐसे फ़ंक्शन को कोड नहीं करना चाहता हूं जो प्रत्येक नियंत्रक के लिए संदेशों को रीसेट करेगा जिसमें मेरे पास निर्देश के साथ इनपुट है। –

+0

मैंने जेएसफ़िल्ड अपडेट किया (हटाया गया $ लागू()) और एनजी-फोकस जोड़ा। एक नज़र देख लो। अगर मैं केवल मेरे लिए काम करता हूं तो मैं उलझन में रहूंगा :) –

+1

मुझे एक नज़र थी। वास्तव में यह काम करता है। लेकिन अगर आप एनजी फोकस को हटाते हैं, तो ऐसा नहीं होता है। आपके उदाहरण ने मुझे कुछ समझने में मदद की: एनजी-फोकस को कोणीय जेएस द्वारा संभाला जा रहा है, यह फोकस पर $ पाचन चक्र करता है, इसलिए उस स्थिति में मुझे कॉलबैक ईवेंट में ऐसा करने की आवश्यकता नहीं है। अगर मैं एनजी-फोकस से छुटकारा पाना चाहता हूं, तो मुझे $ आवेदन की आवश्यकता है। –

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