कोणीय 2: घटक से तत्व का उपयोग करें, getDocumentById काम नहीं करता

Question

मेरे पास एक कोणीय 2 घटक है जहां मैं अपनी आईडी द्वारा एक तत्व div <div id ="myId"> पुनर्प्राप्त करना चाहता हूं। मैं अपने घटक (टाइपस्क्रिप्ट) में document.getElementById("myId") करने का प्रयास करता हूं, लेकिन मुझे एक त्रुटि मिलती है: "नाम दस्तावेज़ नहीं मिल रहा है"। मैं देखता हूं कि अन्य पदों में हम @ViewChild का उपयोग करके कुछ ऐसा कर सकते हैं, हालांकि मुझे नहीं लगता कि हम इसका उपयोग किसी div, किसी भी विचार से कैसे कर सकते हैं?

Answer 1

आप TemplateRef जोड़कर एक div के साथ @ViewChild का उपयोग कर सकते हैं।

खाका

<div id ="myId" #myId> 

घटक

import { Component, ViewChild, ElementRef, AfterViewInit } from '@angular/core'; 

    @Component({ 
    selector: 'app-root', 
    templateUrl: './app.component.html', 
    styleUrls: ['./app.component.css'] 
    }) 
    export class AppComponent implements AfterViewInit { 
    @ViewChild('myId') myId: ElementRef; 

    constructor() { 
    } 

    ngAfterViewInit() { 
     console.log(this.myId.nativeElement); 
    } 
    } 

This blog post काड़ा एरिक्सन द्वारा इस तरह काम करने के लिए कोणीय दृष्टिकोण से परिचित प्राप्त करने के लिए एक बहुत अच्छी पढ़ने है।

Answer 2

तत्व को खाका संदर्भ चर जोड़े आप के लिए उपयोग की जरूरत है:

<div #myDiv></div> 

और घटक में:

class MyComponent implements AfterViewInit { 
    @ViewChild('myDiv') myDiv: ElementRef; 

    constructor() {} 

    ngAfterViewInit() { 
     console.log(this.myDiv); 
    } 
}