angular - Hur får man enhetsbredd och enhetshöjd i Ionic med TypeScript?

Jag försöker få enhetsbredd och -höjd i Ionic 2 med TypeScript.

I den tidigare versionen av Ionic 2 använde jag,

window.screen.width
window.screen.height

men i den nyare versionen fungerar detta inte.

Hur fungerar det med TypeScript + Ionic 2?

Svar #1

Du kan använda plattformsinformationen för detta.

Internt använder plattformen window.innerWidth och window.innerHeight men

Att använda denna metod är att föredra eftersom dimensionen är ett cachat värde, vilket minskar risken för flera och kostsamma DOM-läsningar.

Ionic 4/5

Dokumentation: 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

Dokumentation: 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());
    });
  }
}

Svar #2

Försök att använda window.innerHeight och window.innerWidth för att få höjden respektive bredden på enheten.

Relaterade artiklar