2016-06-18 15 views
5

एक घटक टेम्पलेट में मेरे पास एक छवि है। एक बुलियन पर आश्रित मैं इसके ऊपर एक और छवि रखना चाहता हूं। अंतिम परिणाम इस तरह दिखता है: enter image description hereतत्व की कोणीय 2 परिवर्तन स्थिति

दूसरी छवि हरे रंग की चयनकर्ता छवि है। ऐसा करने के लिए, मुझे मुख्य शीर्षक छवि के आयामों पर निर्भर चयनकर्ता छवि को स्थानांतरित करने की आवश्यकता है। ईटीए: कुछ छवियां चौड़ी से अधिक हैं जबकि अन्य अधिक व्यापक हैं। चयनकर्ता छवि का शीर्ष ऑफसेट शीर्षक छवि की वास्तविक ऊंचाई पर निर्भर करता है।

मेरे पास छवियों की load घटना के लिए एक ईवेंट हैंडलर है और जब दोनों लोड होते हैं तो मैं स्थिति करना चाहता हूं। दोनों छवियां @ViewChild के माध्यम से घटक में उपलब्ध हैं। मैंने offsetTop और offsetLeftnativeElement के गुणों को सेट करने का प्रयास किया लेकिन वे केवल पढ़ने के लिए हैं। मैंने सत्यापित किया है कि मेरे पास load हैंडलर में सही आयामों के साथ दोनों छवियां हैं।

मैं इसे टेम्पलेट में या अपने load हैंडलर में कैसे कर सकता हूं?

मैं गणना top और left स्थिति (शीर्षक छवि के आधार पर) load हैंडलर में और चुनें छवि पर टेम्पलेट में मैं [style.top]="top" [style.left]="left" की तरह कुछ कहा:

+0

इसका कोणीय से कोई लेना-देना नहीं है। शुद्ध सीएसएस पर्याप्त होगा। – dfsq

+0

कैसे? मैं शीर्षक छवि के आयामों को नहीं जानता। चयनकर्ता छवि के लिए निश्चित ऑफसेट काम नहीं करेंगे। – hholtij

+0

पोस्ट एचटीएमएल, इसके बिना अनुमान लगाने की कोशिश करने के लिए यह समझ में नहीं आता है। – dfsq

उत्तर

9

किसी और मामले किसी में एक ऐसी ही समस्या के लिए एक समाधान की जरूरत है (जहां top और left स्ट्रिंग्स "पीएक्स" के साथ समाप्त हो रही हैं)।

+0

'px" 'भाग के लिए धन्यवाद! –

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