How to calculate each and every page height from top to bottom in angular ? This syntax work in JavaScript but give error in angular
console.log( (document.height !== undefined) ? document.height : document.body.offsetHeight+'px');
What I want is to have each page height but when items are added dynamically , it should give me the new height of page.
Try this instead:
console.log(window.innerHeight);
import { Component, ElementRef, Renderer2, OnInit } from '@angular/core';
@Component({
selector: 'app-component',
template: '<p *ngFor='let item of arr'>item {{item?.name}}</p>',
})
export class YourComponent implements OnInit {
arr=[];
constructor(private el: ElementRef, private renderer: Renderer2) {}
ngOnInit() {
this.calculatePageHeight();
setTimeout(() => {
this.addElementToDOM();//like your API call
this.calculatePageHeight();
}, 4000); // Adjust the delay based on your use case
}
addElementToDOM() {
this.arr=[
.......
];
}
calculatePageHeight() {
const documentHeight = Math.max(
document.documentElement.clientHeight,
window.innerHeight || 0
);
console.log('Updated Document Height: ' + documentHeight + 'px');
}
}