Screen orientation not detected in ionic 4

Used the below implementation for screen rotation plugin:
import { ScreenOrientation } from ‘@ionic-native/screen-orientation/ngx’;
() => {
console.log(‘Orientation Changed’);

ERROR TypeError: Invalid event target
at setupSubscription (fromEvent.js:50)
at Observable._subscribe (fromEvent.js:24)
at Observable.push…/node_modules/rxjs/_esm5/internal/Observable.js.Observable._trySubscribe (Observable.js:43)
at Observable.push…/node_modules/rxjs/_esm5/internal/Observable.js.Observable.subscribe (Observable.js:29)
at ProjectListPage.push…/src/app/page-routing/project-list/ (
at callProviderLifecycles (core.js:22416)
at callElementProvidersLifecycles (core.js:22390)
at callLifecycleHooksChildrenFirst (core.js:22380)
at checkAndUpdateView (core.js:23316)
at callWithDebugContext (core.js:24177)

Same problem here. Workaround with browser orientation doesn’t work with IOS.

I have also faced the same issue one month ago, Still haven’t found a solution. Cordova screen orientation not working.

I have found that the ScreenOrientation stuff is pretty flaky – working sometimes and not working other times.

I worked around it in several ways. Sometimes I just query Platform for the current orientation:

    // in the constructor:
    private platform: Platform,

    // in the code in ionViewWillEnter:
    this.isPortrait = this.platform.isPortrait();

Most of my workaround was to use media queries in SCSS: e.g.,

@media (orientation: portrait) {
  .image-grid {
    margin-top: 10vh;
  .image {
    max-width: 25vw;    // fit 4 across 

@media (orientation: landscape) {
  .image-grid {
    margin-left: 15vw;
  .image {
    max-width: 25vh;    // fit 4 rows

Finally in a few cases, I listened for the window:resize event, which I found worked better then listening for the window:orientation event:

<!-- window:resize works more consistently then window:orientation, for some reason -->
<ion-content (window:resize)="checkOrientation()">
    ... html here ...

Hope this helps!