Javascript 使用ngIf时找不到div

如果我尝试选择ngIf指令中存在的DOM元素，则该元素为null。如果我删除ngIf，那么我可以选择它

ngAfterViewInit() {
  const outer = document.getElementById('external-events');
  console.log(outer);
}

组件模板中的代码，未找到div:

<div *ngIf="groupedPatchGroups">
  <div id="external-events">
      stuff here
  </div>
  <br />
</div>

这里的东西

去掉*ngIf，外部报告div的内容

ngAfterViewInit是否在数据返回之前运行，以确定ngIf会发生什么情况？我希望ngIf首先运行，ngAfterViewInit将是最后一个运行的东西

---

注意：groupedPatchGroups值在ngOnInit中设置。

访问新创建元素的一种方法是在

div上设置一个：

<div *ngIf="groupedPatchGroups">
  <div #externalEvents>
      stuff here
  </div>
  <br />
</div>

请参阅以获取演示。
只有当ngIf中的表达式为true时，才会使用ngIf创建DOM元素，如果ngIf中的表达式为false，则不会创建DOM元素。在您的情况下，如果groupedPatchGroups=true，则只有您才能获得ngIf div中的div。
请尝试以下操作

constructor(private cdref: ChangeDetectorRef)

ngAfterViewInit() {
  this.cdref.detectChanges();
  const outer = document.getElementById('external-events');
  console.log(outer);
}

那么
groupedPatchGroups
是否异步加载？如果是这样，则不能保证在运行
ngAfterViewInit
时加载它
constructor(private cdref: ChangeDetectorRef)

ngAfterViewInit() {
  this.cdref.detectChanges();
  const outer = document.getElementById('external-events');
  console.log(outer);
}