कभी-कभी एंगुलर में बिल्ट-इन फिल्टर आउटपुट को फ़िल्टर करने की जरूरतों या आवश्यकताओं को पूरा नहीं कर सकते हैं। ऐसे मामले में एक कस्टम फ़िल्टर बनाया जा सकता है जो आउटपुट को आवश्यक तरीके से पारित कर सकता है।
कस्टम फ़िल्टर कैसे बनाएँ
नीचे के उदाहरण में हम नियंत्रक से दृश्य वस्तु के माध्यम से एक स्ट्रिंग पास करने जा रहे हैं, लेकिन हम यह नहीं चाहते कि स्ट्रिंग को प्रदर्शित किया जाए।
हम यह सुनिश्चित करना चाहते हैं कि जब भी हम स्ट्रिंग प्रदर्शित करते हैं, हम एक कस्टम फ़िल्टर पास करते हैं जो एक और स्ट्रिंग को जोड़ देगा और उपयोगकर्ता को पूरा स्ट्रिंग प्रदर्शित करेगा।
Event Registration Guru99 Global Event
This tutorial is {{tutorial | Demofilter}}
कोड स्पष्टीकरण:
- यहाँ हम एक स्ट्रिंग "Angular" पास कर रहे हैं जिसमें एक सदस्य चर है जिसे ट्यूटोरियल कहा जाता है और इसे स्कोप ऑब्जेक्ट में संलग्न करना है।
- कोणीय फ़िल्टर सेवा प्रदान करता है जिसका उपयोग हमारे कस्टम फ़िल्टर बनाने के लिए किया जा सकता है। 'डेमॉफिल्टर' हमारे फिल्टर को दिया गया एक नाम है।
- यह मानक तरीका है जिसमें एक कस्टम फ़िल्टर परिभाषित किया गया है जिसमें एक फ़ंक्शन वापस आ जाता है। यह फ़ंक्शन वह है जिसमें कस्टम फ़िल्टर बनाने के लिए कस्टम कोड होता है। हमारे फ़ंक्शन में, हम एक स्ट्रिंग "एंगुलर" ले जा रहे हैं, जो हमारे दृष्टिकोण से फ़िल्टर और स्ट्रिंग "ट्यूटोरियल" को इसमें जोड़ रहा है।
- हम अपने सदस्य चर पर अपने डीमोफिल्टर का उपयोग कर रहे हैं जो नियंत्रक से दृश्य में पारित किया गया था।
यदि कोड सफलतापूर्वक निष्पादित किया जाता है, तो ब्राउज़र में अपना कोड चलाते समय निम्न आउटपुट दिखाया जाएगा।
आउटपुट:
आउटपुट से,
- यह देखा जा सकता है कि हमारा कस्टम फ़िल्टर लागू किया गया है और
- शब्द 'ट्यूटोरियल' को स्ट्रिंग के अंत में जोड़ा गया है, जिसे सदस्य चर ट्यूटोरियल में पारित किया गया था।
सारांश:
यदि कोई आवश्यकता है जो कोणीय में परिभाषित किसी भी फ़िल्टर से पूरी नहीं होती है, तो आप अपना कस्टम फ़िल्टर बना सकते हैं और अपने कस्टम कोड को जोड़कर यह निर्धारित कर सकते हैं कि आप फ़िल्टर से किस प्रकार का आउटपुट चाहते हैं।