Jignesh Jignesh - 4 months ago 183
TypeScript Question

How to get device width and height in Ionic 2 using Type Script?

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

You can use the Platform information like this:

import {Component} from '@angular/core';
import {Platform} from 'ionic-angular';

@Component({...})
export MyApp {
  constructor(platform: Platform) {
    platform.ready().then((readySource) => {
      console.log('Width: ' + platform.width());
      console.log('Height: ' + platform.height());
    });
  }
}

Like you can see in Ionic docs, internally the platform uses the window.innerWidth and window.innerHeight because

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

Comments