Angular - window.screen.height doesn't work on template-CodePudding

I have a problem when I want to optimize part of my template for mobiles in horizontal mode.

TS:

window = window;

Template:

<div [ngStyle]="{'height': window.innerHeight < window.innerWidth ?
 window.screen.height : (widget == 'playlist' ? '334px' : '275px')}">
</div>

I'm getting nothing from window.screen.height but when I log it, it's returning good values. I was trying to use it like value but the result was the same.

CodePudding user response：

I think you are not telling your style height what size unit it should get. Pixels px, Percentage %, etc. I added the pixel unit as an example this:

 <div [ngStyle]="{'height': window.innerHeight < window.innerWidth ?
    window.screen.height   'px' : (widget == 'playlist' ? '334px' : '275px')}">
 </div>