मेरे पास दो घटक हैं।

पहले घटकों में form textara नियंत्रण के साथ होता है, और दूसरे घटक में एक SVG ग्राफ़ होता है। जब उपयोगकर्ता textarea नियंत्रण में अधिक विवरण जोड़ता है और उस फॉर्म तत्व के कारण आकार बदल जाता है, हालांकि, मैं अपने SVG ग्राफ़ को उस परिवर्तन के साथ संरेखित करने के लिए इसका पता लगाना चाहता हूं।

<div id="comp1"> 
<form action="/action_page.php" id="usrform">

<textarea rows="4" cols="50" name="comment" form="usrform">
Enter text here...</textarea>
</form>
<div>

<div id="comp2">
</div>

जब भी comp1 का आकार बदलता है, मैं परिवर्तनों का पता लगाना चाहता हूं।

0
kandarp 18 अक्टूबर 2019, 08:31
आप नहीं कर सकते resize HTML तत्वों के लिए उपलब्ध नहीं है। यह केवल विंडो पर चालू होता है। इसे तत्वों को भी उपलब्ध कराने का प्रस्ताव है लेकिन अभी तक नहीं है। और पढ़ें developer.mozilla.org/en-US/docs/ वेब/एपीआई/विंडो/resize_event
 – 
Manish
18 अक्टूबर 2019, 08:56

2 जवाब

आप इसे (window:resize) फ़ंक्शन के साथ कर सकते हैं।

<div id="comp1" (window:resize)="yourFunction($event)">  // <-- add this code fragment
<form action="/action_page.php" id="usrform">

<textarea rows="4" cols="50" name="comment" form="usrform">
Enter text here...</textarea>
</form>
<div>

<div id="comp2">
</div>
0
JuNe 18 अक्टूबर 2019, 08:38
कार्य करना चाहिए। उदाहरण: stackblitz.com/edit/angular-dynamic-grid-list- cols-alprdz
 – 
JuNe
18 अक्टूबर 2019, 08:50

कोणीय HostListener डेकोरेटर प्रदान करता है जो सुनने के लिए एक DOM ईवेंट घोषित करता है, और जब वह विंडो का आकार बदलता है ईवेंट होता है, तो उसे चलाने के लिए एक हैंडलर विधि प्रदान करता है।

नीचे के अनुसार

import {HostListener} from '@angular/core';

class AppComponent{
@HostListener('window:resize', ['$event'])
  resize(event) {
    console.log(event);
 }
}

यदि आप div आकार बदलने पर एक आकार बदलें ईवेंट ट्रिगर करना चाहते हैं तो आप https://www.npmjs.com/package/angular-resize-event पैकेज। आप सीधे उस पैकेज का उपयोग कर सकते हैं या directive स्रोत कोड को यहां और अपने प्रोजेक्ट में इसका इस्तेमाल करें।

0
Ankit Prajapati 18 अक्टूबर 2019, 08:56
1
जैसा कि मैंने समझा, विंडो परिवर्तन केवल तभी पता चला जब ब्राउज़र का आकार बदल गया। मेरे मामले में ब्राउज़र का आकार नहीं बदला जाता है, केवल एक
का आकार बदला जा रहा है, जो इस घटना को सक्रिय नहीं करता है।
 – 
kandarp
18 अक्टूबर 2019, 08:49
हाँ @kandarp, लेकिन मैंने एक पैकेज विवरण जोड़ा है, आप उस package को जोड़ सकते हैं या अपने पैकेज में directive फ़ाइल की प्रतिलिपि बना सकते हैं।
 – 
Ankit Prajapati
18 अक्टूबर 2019, 08:57