ViewChild returns undefined

Question

재질 디자인과 각도 5를 사용하고 있습니다. 재료 로더를 사용하려고 했으므로 탐색을 시작할 때 로더를 표시하고 끝에서 로더를 제거 할 때 this question의 응답을받습니다. 나는

<mat-progress-bar #spinnerElement [mode]="'indeterminate'" [color]="'primary'"></mat-progress-bar> 

에 의해 viewchild을 시도하고 아래에있는 내 구성 요소 생성자에서 호출 :

@ViewChild('spinnerElement') 
spinnerElement: ElementRef; 

constructor(
..... 
    private ngZone: NgZone, 
    private renderer: Renderer) { 
     console.log(this.spinnerElement, 'spinnerElement'); 
    } 

그러나 콘솔이 항상 undefined를 반환합니다. Angular에 새로운 비트. 왜 어떤 사람?

Answer 1

각도 life cycle을 살펴보십시오.

아직 렌더링되지 않았기 때문에 생성자에서 DOM 요소에 액세스 할 수 없습니다.

ngOnInit()에서 'spinnerElement'에 액세스 해보십시오.

ngOnInit()

각도가 먼저 디스플레이 한 후 데이터 바인딩 속성을 지정/컴포넌트를 초기화하고 지정/컴포넌트의 입력 속성을 설정한다. 첫 번째 ngOnChanges() 이후에 한 번 호출됩니다.

Answer 2

@ViewChild 에 액세스하십시오. 초기화하기 전에 사용할 수 없습니다.