Javascript 如何获取角度组件中的元素并隐藏/显示它们？

我正在尝试在Angular中构建向导组件。为了制作进度条和隐藏/显示步骤，我希望能够通过计算向导中“步骤”模板的数量来计算出向导中的步骤数。我刚刚了解了

ContentChildren

的概念，它为我提供了

elementRef

对象，但我不知道如何从这里开始：

wizard.component.ts

import { ... } from '@angular/core

export class WizardComponent implements AfterViewInit, OnInit {

    @ContentChildren('step') steps: QueryList<any>;

}

ngAfterViewInit() {

    this.steps.forEach(step => console.log(step));

}

app.component.html

<ng-content></ng-content>

<app-wizard>
    <div #step> First Step Screen </div>
    <div #step> Second Step Screen </div>
</app-wizard>

第一步屏幕
第二步屏幕

我看不到问题正文中的显示/隐藏部分。假设private currentStep=0。并且有一个类似activeScreen的对象。activeScreen=this.wizardStepElements[this.currentStep]。会有用的，对吗？