मैट-टेबल के लिए प्रत्येक कॉलम के नीचे एक फिल्टर जोड़ना
मैं एक और StackOverflow उत्तर से एक Stackblitz में आया था और यह देखना चाहता था कि क्या मैं प्रत्येक स्तंभ के लिए मूल तालिका में फ़िल्टर जोड़ सकता हूं।
यहाँ मेरा स्टैकब्लिट्ज़ है जो मैंने कोशिश की थी और यह निकटतम था जो मुझे मिल सकता है (कृपया सीएसएस / स्टाइल को अनदेखा करें)। मैंने कॉलम के तहत एक इनपुट फ़िल्टर किया। (ध्यान दें कि मैंने वास्तविक कामकाजी फ़िल्टर को अपने .ts फ़ाइल में लागू नहीं किया है) मैं हालांकि कुछ दिलचस्प देख रहा हूँ, कि कॉलम को सॉर्ट करने के लिए बटन न केवल हेडर / कॉलम नाम के साथ लिपटा जाता है, बल्कि फ़िल्टर भी - जब कोई उपयोगकर्ता फ़ील्ड पर ध्यान केंद्रित करने के लिए फ़िल्टर पर क्लिक करता है, तो वे एक प्रकार को भी ट्रिगर करेंगे।
मैंने / हैडर टैग के mat-form-fieldनीचे पूरे ब्लॉक को जोड़ने की thकोशिश की और यह भी काम नहीं करता है या नहीं दिखाता है। मैं यहाँ एक नुकसान में हूँ और यह पता नहीं लगा सकता कि नीचे दिए गए फ़िल्टरों को बिना छाँटे बटन में कैसे रखा जाए।
जवाब
यदि आप इनपुट फ़ील्ड पर क्लिक करते समय सॉर्ट बटन को क्लिक करने से रोकना चाहते हैं, तो आप इनपुट फ़ील्ड में जोड़ने (click)="$event.stopPropagation();"का प्रयास कर सकते हैं । यह भी संभव है कि आपको ईवेंट के बजाय इसे (mouseup)या (mousedown)ईवेंट में जोड़ना पड़ सकता है (click)।