2016-11-17 22 views
9

में तत्व ऊंचाई और चौड़ाई परिवर्तन का पता लगाने के लिए मैं एक समाधान की तलाश में था, लेकिन कुछ भी नहीं मिला (केवल (window:resize) के बारे में लेख, लेकिन यह मैं नहीं ढूंढ रहा हूं)।कोणीय 2

Angular 2 में तत्व आकार परिवर्तन का पता कैसे लगाएं?

<div #myElement (sizeChanged)="callback()" /> 

मैं कुछ CSS एनिमेशन का उपयोग करें और तत्व के height और width परिवर्तन का पता लगाने के लिए चाहते हैं।

+0

क्या आपने इसे हल किया है सर ?? क्योंकि मैं भी वही चीज़ चाहता हूं। – Pranjal

उत्तर

7

समस्या भी एक कोणीय 2 समस्या नहीं है। अधिक आम तौर पर, आप window के अलावा किसी भी तत्व में आकार परिवर्तन का पता कैसे लगाते हैं? onresize ईवेंट है, लेकिन यह केवल window के लिए ट्रिगर किया गया है और कोई अन्य स्पष्ट समाधान नहीं हैं।

सामान्य दृष्टिकोण यह है कि कई लोग इसका दृष्टिकोण करते हैं, 100 एमएमएस का अंतराल सेट करना और बदलाव का पता लगाने के लिए div की चौड़ाई और ऊंचाई की जांच करना है। जैसा लगता है उतना भयानक, यह सबसे आम दृष्टिकोण है।

this answer से अधिक सामान्य प्रश्न के लिए, केवल घटनाओं का उपयोग करके ऐसा करने के लिए एक लाइब्रेरी है: http://marcj.github.io/css-element-queries/। माना जाता है, यह काफी अच्छा है। आप जो खोज रहे हैं उसे पाने के लिए आप ResizeSensor का उपयोग करेंगे।

बेशक, आप केवल div की अपेक्षा करते हैं जब विंडो करता है। फिर onresize वह है जिसे आप ढूंढ रहे हैं।