How to get device width and height in Ionic using TypeScript?

Question

I am trying to get device width and height in ionic 2 using typescript.

In previous version of ionic 2 I used,

window.screen.width window.screen.height 

but in newer version this is not working.

How it is work with Type Script + ionic 2?

Answer 1

You can use the Platform information for this.

Internally the platform uses the window.innerWidth and window.innerHeight but

Using this method is preferred since the dimension is a cached value, which reduces the chance of multiple and expensive DOM reads.

Ionic 4/5

Docs: https://ionicframework.com/docs/angular/platform#width-number

import { Component } from '@angular/core'; import { Platform } from '@ionic/angular';  @Component({...}) export MyApp {   constructor(platform: Platform) {     platform.ready().then(() => {       console.log('Width: ' + platform.width());       console.log('Height: ' + platform.height());     });   } } 

Ionic 2/3

Docs: https://ionicframework.com/docs/v3/api/platform/Platform/#width

import { Component } from '@angular/core'; import { Platform } from 'ionic-angular';  @Component({...}) export MyApp {   constructor(platform: Platform) {     platform.ready().then(() => {       console.log('Width: ' + platform.width());       console.log('Height: ' + platform.height());     });   } } 

Answer 2

Try using window.innerHeight and window.innerWidth to get height and width of the device respectively.