獲得 'nativeElement.querySelector不是一個函數' 在Angular2

Question

我試圖訪問一個div在Angular2像下面的例外：

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

@Component({ 
    selector: 'main', 
    template: ` 
    <div #target class="parent"> 
     <div class="child"> 
     </div> 
    </div> 
    ` 
}) 

export class MainComponent implements AfterContentInit { 
    @ViewChild('target') elementRef: ElementRef; 

    ngAfterContentInit(): void { 
     var child = this.elementRef.nativeElement.querySelector('div'); 
     console.log(child); 
    } 
} 

，但我得到以下異常：

Exception: Call to Node module failed with error: TypeError: this.elementRef.nativeElement.querySelector is not a function

Answer 1

該模板使用angular2-universal進行服務器端呈現。 https://github.com/angular/universal#universal-gotchas

嘗試：

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

@Component({ 
    selector: 'main', 
    template: ` 
    <div #target class="parent"> 
     <div class="child"> 
     </div> 
    </div> 
` 
}) 
export class MainComponent implements AfterContentInit { 
    @ViewChild('target') elementRef: ElementRef; 

    constructor(private renderer: Renderer) {} 

    ngAfterContentInit(): void { 
     var child = this.renderer.invokeElementMethod(this.elementRef.nativeElement, 'querySelector', ['div']); 
     console.log(child); 
    } 
}