ViewChild返回undefined

Question

我正在使用材料设计和Angular 5.我正在尝试使用材料加载器，因此当导航开始显示加载器和何时根据this question中的答案移除加载器。我试过viewchild

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

并在我的组件构造函数中调用如下：

@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'。

OnInit（）：

在Angular首次显示数据绑定属性并设置指令/组件的输入属性后初始化指令/组件。在第一次ngOnChanges（）之后调用一次。

Answer 2

访问@ViewChild中的ngOnInit()，在初始化之前不能使用它。