是否可以声明多个 @ViewChild() 元素以及如何访问它们？答案

【问题标题】：Is it possible to declare multiple @ViewChild() elements and how can I access them?是否可以声明多个 @ViewChild() 元素以及如何访问它们？
【发布时间】：2018-06-27 17:57:30
【问题描述】：

我有这个模板：

<ion-content no-bounce>
  <ion-nav  #pageView class="no-scroll"></ion-nav>
</ion-content>

 <ion-grid #menu class="menu" (swipe)="swipeEvent($event)"> 
 </ion-grid>

我想要的是访问 DOM 元素 #menu 和 #pageView 我正在尝试这样做：

@ViewChild('menu') 菜单 : ElementRef;

@ViewChild('pageView') pageView : ElementRef;

但似乎这些元素是未定义的，因为当我 console.log(this.menu, this.pageView) 日志抛出未定义时。我希望你能帮助我。

【问题讨论】：

可能是因为 HTML 还没有准备好？尝试在ngAfterViewInit()进行控制台
我试了一下，还是抛出 undefined
对不起@localStanger 是的，你有原因，我试图访问构造函数上的元素:( 代替 ngAfterViewInit() 非常感谢你的回答
太棒了！欢迎您！

标签： angular

【解决方案1】：

您可以使用 Angular 生命周期来解决这个问题要使用您的 viewchild 变量，您必须使用 ngAfterViewInit，然后只有该视图可用。

即

ngAfterViewInit(){
  console.log(this.menu, this.pageView) 
}

【讨论】：

感谢您的回答