Unable to detect Canvas tag inside ngfor iteration - Angular

I want to work with Canvas tag inside ngfor but every times it showing undefined or null. I tried in many ways but not worked. Please help me.

HTML:

<div class="col-sm-6 col-lg-4 pb-30 blog-parent" *ngFor="let item of blogList; let i = index;">
    <div class="blog-item">
        <a href="#">
            <div class="blog-item-figure">
                <canvas class="blog-canvas" id="canvas"></canvas>
            </div>
        </a>
    </div>
</div>

TS:
ngOnInit(): void {
    this.cropImage();
}
cropImage() {
    let canvas: any = document.getElementsByClassName("blog-canvas");
    for (let i = 0; i < this.blogList.length; i++) {
        console.log("canvas: ", canvas[i]);
    }

}

Replace ngOnInit() with ngAfterViewInit().