मैं छवियों को अपलोड करने के लिए एक छोटा वेबपैप बनाने की कोशिश करता हूं।

    <input type="file" id="imageUpload" name="image" (change)="imageToList()" accept="image/*"  capture>

कोणीय में मैं छवि को एक ऐरे में जोड़ने के लिए निम्न कोड चलाता हूं और यदि उपयोगकर्ता ने अपनी प्रक्रिया समाप्त कर ली है तो अपलोड करें। नहीं, मैं सिर्फ input.files में मान दिखाना चाहता हूं।

   constructor() {
        this.input = document.getElementById('imageUpload') ;
    }

    imageToList() {
        console.info(this.input.files[0]);
    }

मुझे त्रुटि मिलती है, Cannot read property 'files' of null। अगर मैं Google क्रोम में कमांडलाइन चलाता हूं, तो मैं देखता हूं कि files चुनी गई फ़ाइल के साथ मौजूद है।

enter image description here

यह एक समय की समस्या की तरह लगता है, लेकिन मुझे इसे ठीक करने का कोई विचार नहीं है। श्रोता के बाद विधि चलाने के लिए Angular2 में कोई तरीका है? या इस तरह सोचने के लिए कोई अन्य उपयोगकर्ता मामला है?

0
michael-mammut 26 जिंदा 2017, 17:09

1 उत्तर

सबसे बढ़िया उत्तर

सबसे आसान तरीका - जीवनचक्र हुक का उपयोग करना (शायद ngAfterContentInit या ngAfterViewInit): दस्तावेज़ीकरण

इसे करने का सही तरीका - @ViewChild का उपयोग करना: दस्तावेज़ीकरण

अपडेट करें: क्षमा करें, शायद आपको @Component के अंदर अपने इनपुट के संदर्भ की बिल्कुल भी आवश्यकता नहीं है। कोशिश

(change)="imageToList($event)"
imageToList(event: any): void{
    console.log(event);
}
1
A. Tim 26 जिंदा 2017, 17:17