Почему я получаю нулевое значение при попытке получить элемент по идентификатору?

Question

Я пытался изменить элемент на странице, когда шаблон был загружен:

ngAfterContentInit() {
    var oldParent = document.getElementById('card-list-wrapper');
    console.log(oldParent);
    document.body.innerHTML += oldParent;
    oldParent.innerHTML = '';
  }

Шаблон:

<div *ngIf="dataLoaded2" id="card-list-wrapper"></div>

Но я получаю console.log(oldParent); ноль, почему?

Answer 1

Хорошая практика - избегать ванильного JS в машинописном файле:

<div *ngIf="dataLoaded2" id="card-list-wrapper" #card></div>

и в файле ts:

export class elementComponent implements OnInit {

  @ViewChild("card", {read: ElementRef}) card: ElementRef;

    constructor(private elementRef: ElementRef) {}

    ngAfterViewInit(): void {
        console.log(this.card.nativeElement);
    }  

}