H. Pauwelyn
H. Pauwelyn

Reputation: 14280

Set height of div equal to height of window angular

How could I set the height of a div equal to the height of the window? I've found on this question Dynamically updating css in Angular 2 saying that I must use code below:

<div class="home-component" 
     [style.width.px]="width" 
     [style.height.px]="height">Some stuff in this div</div>

I've update this code like code below:

<div class="imagecontainer" [style.height.px]="window.innerHeight">
    Some code
</div>

But this give me next error:

Cannot read property innerHeight of undefined

My questions are now:

  1. How could I set the height of the div equal to the height of the inner window with Angular and TypeScript?
  2. How could I do this in one time, because I've to do this multiple times?

Upvotes: 10

Views: 37734

Answers (1)

eko
eko

Reputation: 40647

It's not working because angular2 is trying to search for this.window.innerHeight.

Update your component,

@Component({...})
export class MyClass {

    myInnerHeight: window.innerHeight;
    constructor(){}

}

and use it like this:

<div class="imagecontainer" [style.height.px]="myInnerHeight">
    Some code
</div>

Upvotes: 21

Related Questions