Angularjs 2 @viewChild не работает

Новичок в angularjs 2, мне нужно использовать @viewChild, но он выдает ошибку «Невозможно прочитать свойство 'rotateLeft' of undefined». родитель:

<div><pdfReader [imageUrl]="imgsource" *ngIf="holeDocument.ext == 'pdf'"></pdfReader></div> 

.ts

import { Component ,ViewChild } from '@angular/core';
import {PdfReader} from "../../shared/pdfreader/pdfReader";
@Component({
selector: 'docView',
templateUrl: 'docView.html',
styleUrls : ["docView.less"]
})  
export class DocViewComponent{
@ViewChild('PdfReader') public pdfReader: PdfReader;
constructor(){}
ngAfterViewInit(){
    this.imageRotate();
}             
imageRotate(){ 
this.pdfReader.rotateLeft();
}}

Ребенок:

@Component({
selector: 'pdfReader',
templateUrl: 'pdfReader.html'
})
export class PdfReader{
 @Input() imageUrl : any;
 rotateLeft(){
        console.log('rotateLeft called');
        this.rotationAngel -= 90;
    }
}

person sibi    schedule 02.02.2017    source источник
comment
Я не вижу в вашем вопросе, как вы используете @ViewChild(). Вам не кажется, что это самая важная часть вашего вопроса?   -  person Günter Zöchbauer    schedule 02.02.2017
comment
@GünterZöchbauer @ViewChild('PdfReader') public pdfReader: PdfReader; также редактируется.   -  person sibi    schedule 02.02.2017
comment
Что печатает console.log(this.pdfReader); в ngAfterViewInit()? Является ли HTML в вашем вопросе частью шаблона компонентов. Пожалуйста, добавьте декораторы @Component() и имя класса компонентов в код.   -  person Günter Zöchbauer    schedule 02.02.2017


Ответы (2)


Если вы используете тип компонента для запроса, то кавычки избыточны.

@ViewChild(PdfReader) public pdfReader: PdfReader;

Если вы используете строку в качестве запроса, должна быть соответствующая переменная шаблона

<div><pdfReader #PdfReader [imageUrl]="imgsource" *ngIf="holeDocument.ext == 'pdf'"></pdfReader></div> 

См. также angular 2/typescript : получить элемент в шаблоне

person Günter Zöchbauer    schedule 02.02.2017

 *ngIf="holeDocument.ext == 'pdf'"

*ngIf делает свое дело. элемент не отображается до тех пор, пока это условие не будет выполнено.

вместо этого используйте [скрытый].

<pdfReader [imageUrl]="imgsource" [hidden]="holeDocument.ext != 'pdf'"></pdfReader>
person Subindev    schedule 02.02.2017